0

我的文字后面有一个白色背景。我已经使用 CSS 重新定位，如所述。我希望背景的不透明度为 0.3，但它会影响前景，即使在 html 中它处于不同的分界线中。我是 css 方面的新手，期待有更多专业知识的人的回应。

部分html是：

...
<p><span>Fri</span><span>When Announced</span></p>
<p><span>Sat</span><span>Open</span></p>

</div>

<div class=...
<img src="img/cross.png" alt="Cross" width="340" height="465"/>
</div>

<div id="bkgrnd"></div>

<div id="clear"></div>

</section>

...

CSS是：

    #bkgrnd{
    background-color:#fff;
    border:1px solid #000;
    box-shadow:#332315 .3em .4em .2em;
    opacity: 0.3;
    width:750px;
    height:526px;
    margin-left:89px;
    margin-top:-55px;
    z-index:-2;
    }
4

3 回答 3

0

为了不继承不透明度，您需要使用 RGBa（alpha 通道）而不是不透明度。

见：http ://www.css3.info/introduction-opacity-rgba/

请注意，旧版浏览器不支持 alpha 通道。您可能需要进行 CSS 后备。

于 2013-02-14T21:43:37.753 回答
0

使用opacity将影响任何子元素。您应该改为rgba在您的背景属性上使用，如下所示：

background-color: rgba(255, 255, 255, 0.3);

这将应用background-color不透明度为 30% 的白色。

于 2013-02-14T21:45:26.860 回答
0

查看这篇关于使用 RGBa 代替 opacity 取消继承的文章：

http://acidmartin.wordpress.com/2010/11/21/using-rgba-to-prevent-the-css-opacity-inheritance-from-parent-to-child-elements/

这篇文章解释了如何处理 IE 5-8 的 RGBa 变通方法

于 2013-02-14T21:47:07.667 回答