我正在使用類似于以下代碼的內(nèi)容：<div style="opacity:0.4; background-image:url(...);"> <div style="opacity:1.0;"> Text </div></div>我希望這可以使背景的不透明度為0.4，文本的不透明度為100％。相反，它們都具有0.4的不透明度。
3 回答
守著一只汪
TA貢獻(xiàn)1872條經(jīng)驗(yàn) 獲得超4個(gè)贊
兒童會(huì)遺傳不透明度。如果他們不這樣做，那將會(huì)很奇怪和不便。
您可以為背景圖像使用半透明的PNG文件，也可以為背景顏色使用RGBa（α表示）顏色。
例如，50％的黑色背景褪色：
<div style="background-color:rgba(0, 0, 0, 0.5);">
<div>
Text added.
</div>
</div>
肥皂起泡泡
TA貢獻(xiàn)1829條經(jīng)驗(yàn) 獲得超6個(gè)贊
可以使用以下方法解決您的問題：
CSS alpha透明方法（在Internet Explorer 8中不起作用）：
#div{background-color:rgba(255,0,0,0.5);}
根據(jù)您的選擇使用透明的PNG圖像作為背景。
使用以下CSS代碼段創(chuàng)建跨瀏覽器的alpha透明背景。這是#000000不透明度為0.4％的示例
.div {
background:rgb(0,0,0);
background: transparent\9;
background:rgba(0,0,0,0.4);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#66000000,endColorstr=#66000000);
zoom: 1;
}
.div:nth-child(n) {
filter: none;
}
有關(guān)此技術(shù)的更多詳細(xì)信息，請(qǐng)參閱this，它具有一個(gè)在線CSS生成器。
添加回答
舉報(bào)
0/150
提交
取消