0

我在这里有这个网站:

http://artendijen.com/susan_dev/

我有一个不透明的导航框,导航框中的所有内容也有不透明,我该如何解决这个问题?如果这有什么不同,我在 Windows 7 上使用 Chrome。

.navigation{
    float:left;
    height:550px;
    width:300px;
    background:#000;
    margin-left:-6px;
    margin-top:100px;
    opacity:0.6;
    filter:alpha(opacity=60);
    border-radius: 0 10px 10px 0;
    box-shadow: 5px 0px 3px rgba(0,0,0,.5);
}

.navigation ul{
    list-style:none;
    padding-top:20px;
}

.navigation ul li{
    padding-bottom:20px;
}

.navigation ul li a{
    font-size:18px;
    text-decoration:none;
    color:#FFF;
    text-transform:uppercase;
    font-family:'Conv_Museo300-Regular';
}


.logo{
    text-align:center;
    padding-top:10px;
}
4

3 回答 3

2

不透明度适用于元素及其所有子元素。

使用具有 RGBA 值的背景颜色。

  background: rgba(0,0,0,0.6);
于 2013-10-31T19:26:19.590 回答
0

从中删除opacity规则.navigation并将 alpha 子属性值添加到background-color.

于 2013-10-31T19:25:57.700 回答
0

你无法修复它,opacity对元素和他的所有内容有什么影响。

如果你想也许只是应用不透明度,background-color那么你可以使用 rgba () 值。

background-color: rgba (0,0,0,0.4);

前三个值是黑色中的颜色 0,0,0,第四个值0.4是 alpha 通道 = 透明度级别。

如果你可以使用它,你可以在这里检查兼容性

http://caniuse.com/css3-colors

于 2013-10-31T19:27:28.633 回答