不透明度在不同页面上显示不同的阴影

时间:2013-12-17 20:53:52

标签: css css3 opacity rgba

我正在使用不透明度,它似乎在我使用它的页面上显示不同的阴影。

如果您看一下PS4图片:http://chrisbrighton.co.uk

...然后在同一张图片上...... http://chrisbrighton.co.uk/Gaming.php

您会看到有不同的阴影,但它们都使用相同的CSS规则。

为什么会发生这种情况?

感谢。

3 个答案:

答案 0 :(得分:4)

Gaming.php上的#news-containerbackground: #9bd7f5;。由于您使用rgba()来获得透明度,因此元素下方或上方的所有内容也会受到影响。

而是使用opacity: 0.7;支持rgba()。不透明度属性不会影响其他元素。

答案 1 :(得分:0)

不确定为什么会出现这种情况。这似乎与使用rgba和不透明度有关。如果我是你,我会从这个课程中删除背景。它不仅可以解决您的问题,而且从设计角度看它看起来更好。

.hot-page-title {
height: 300px;
background: rgba(255,102,000,.7);
-webkit-transition: .7s ease-in-out;
;

希望这有帮助。

答案 2 :(得分:0)

是的我已经检查了很长时间的整个代码,#news-container id背景属性会影响你的代码。所以请根据需要删除或调整。希望得到答案!