<分区>
<分区>
我有一个容器,我在 css 中将其不透明度设置为 0.6。 我在上面的容器中有另一个 div,其中有一些带有颜色的文本:白色说“我的文本”。现在的问题是这个文本正在变淡,因为我只希望外部容器不透明而不是文本变淡。有人可以帮忙吗?
下面是html代码:
<div id='cover-part' style='text-align:center1;padding:15px'>
<div id='opaque-cover-part'>
<div id='cover-part-text'><span>THIS TEXT SHOULD NOT FADE</span></div>
</div>
下面是CSS
#cover-part{
position: relative;
background: url(posts/images/1.jpg) no-repeat 0 center, linear- gradient(white, black);
height:250px;
}
#cover-part-text{
position:relative;
font-size: 30px;
color:#FFFFFF;
left: 0px;
bottom:0px;
font-weight:bold;
display:block;
z-index:2;
font-family: helvetica, arial, sans-serif;
height:100px;
width:100%;
padding-left:15px;
padding-top:15px;
}
#opaque-cover-part{
position: absolute;
left: 0px;
bottom:0px;
height:100px;
width:100%;
background:linear-gradient(black, black);
opacity:0.6;
filter:alpha(opacity=50);
z-index:1;
}
最佳答案
这非常简单,您只需在具有此类的元素不透明的范围内添加一个类或 ID。
工作示例:
https://plnkr.co/edit/5jbyZv609LEaKBctKFC1?p=preview
例如:
.not-opaque{
opacity:1;
}
和
<span class='not-opaque'>THIS TEXT SHOULD NOT FADE</span>
关于html - 不透明容器内的文字变淡,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35563138/