透明背景顏色，但只有透明

我需要添加透明度背景顏色，這將改變用戶。就像用戶設置背景色爲＃f00我需要添加0.5透明度。我不能使用rgba（），因爲我得到#RGB格式的顏色。我不能爲所有內容添加透明度。透明背景顏色，但只有透明

2014-02-20 user2982337

css opacity？ http://stackoverflow.com/questions/4386714/css3-cross-browser-opacity –

任何其他解決方案？ – user2982337

請大家，我認爲它是可用的，許多開發人員將需要你的答案 – user2982337

有了您的幫助下，我找到了最好的解決方案我 list($r,$g,$b) = array_map('hexdec',str_split($colorName,2)); echo 'rgba('.$r.','.$g.','.$b.',0.5)'; 感謝所有

來源

2014-02-20 21:37:53 user2982337

如果你不能使用rgba，css opacity應該是一個選項，但會淡入所有內容。我想解決方案可以是一個小小的PNG，不能超越這個。

也許：嘗試使用css opacity並在其中創建另一個div，並使用z-index控制內容不透明度。

來源

2014-02-20 20:37:00

不知道里面的所有內容取不透明度值 – user2982337

如果你的內容總是相同的高度，你可以使用黑客。

使用三個div。一個div包含另外兩個。一格是背景。

一個div是前景/非透明內容。

<div id='holder'> 
<div id='bg'> 

</div> 
<div id='content'> 
Content is here 
</div> 
</div>

然後在css中。使bg和內容的位置相對，以便內部div顯示一個在另一個之上。您可能還必須使用zIndex的或（像這樣）：

#bg { 
opactiy: .5; 
background-color:#333; 
position: relative; 
top: 0px; 
left: 0px; 
height: 300px; 
    } 

#content { 
position: relative; 
top: -300px; // negative of the height 
left: 0px; 
}

誠然，這很容易導致混亂！希望能幫助到你。

來源

2014-02-20 21:17:29

以及如果你不知道元素的高度怎麼辦？ – user2982337

我已經創建了類似這樣的內容，但是#bg做的絕對是因爲parrent元素的高度來自#content，而最後一個認爲錯誤是z-index。現在asolute，z-index：10高於relative，z-index：12 – user2982337

如果內容總是處於相同的絕對位置（就像頁面的左上角那樣），那麼你可以使用position：absolute他們 - 然後頂部和左邊是相同的兩個。（我認爲你正在嘗試這樣做？）不幸的是，如果內容可能從任何地方開始，並且是任何高度，我不知道如何讓它們看起來相互重疊。 –

的Javascript可以做的伎倆。自從你提到它之後，我會假設你正在使用jQuery。

View the fiddle here

如果你可以使用jQuery中獲取顏色，它會在格式返回一個字符串 'RGB（X，X，X）'。然後你可以使用一個函數將它轉換爲一個rgba字符串。

function rgbToRgba(rgbString, alpha) { 
    rgba = rgbString.replace('rgb', 'rgba'); 
    rgba = rgba.replace(')', ',' + alpha + ')'); 
    return rgba; 
}

然後，您可以設置與新值的CSS。

var color = $('.makeMeRgba').css('background-color'); 
var rgba = rgbToRgba(color, 0.5); 

$('.makeMeRgba').css('background-color', rgba);

來源

2014-02-20 22:01:51 nwalton

透明背景顏色，但只有透明

回答

相關問題