div+css背景透明,文字也跟着透明,怎么让文字和图片不透明呢?
像图中这个这样,下面的大图我想做成JS那种一会一张,图片右下角有【1】【2】这样的标示,然后上面的导航的底色,想要半透明,但我设置了,导航上的文字就跟着透明了,我单独给导...
像图中这个这样,下面的大图我想做成JS那种一会一张,图片右下角有【1】【2】这样的标示,然后上面的导航的底色,想要半透明,但我设置了,导航上的文字就跟着透明了,我单独给导航文字设置颜色或者透明度它还是和导航一样?
这是div
<div class="banner">
<div class="bn"><div class="logo"><img src="images/logo.gif" width="60" height="52" /></div>
<div class="nav">
<ul>
<li>在线留言</li>
<li>关于我们</li>
<li>热点新闻</li>
<li>产品推介</li>
<li>经营团队</li>
<li>经营范围▼</li>
<li>首页</li>
</ul>
</div></div>
</div>
相关css是这样的
.banner {
width: 1000px;
position: relative;
height: 345px;
background-image: url(../images/banner.jpg);
}
.banner .bn {
position: absolute;
height: 60px;
width: 1000px;
background-color: #41403e;
filter: alpha(opacity=47);
}
.bn .logo {
float: left;
}
.nav{
height:24px;
width:900px;
float: right;
margin-top: 18px;
}
.nav li{
text-align:center;
float:right;
padding-right:15px;
color:#fff;
padding-left: 30px;
font-size: 14px;
} 展开
这是div
<div class="banner">
<div class="bn"><div class="logo"><img src="images/logo.gif" width="60" height="52" /></div>
<div class="nav">
<ul>
<li>在线留言</li>
<li>关于我们</li>
<li>热点新闻</li>
<li>产品推介</li>
<li>经营团队</li>
<li>经营范围▼</li>
<li>首页</li>
</ul>
</div></div>
</div>
相关css是这样的
.banner {
width: 1000px;
position: relative;
height: 345px;
background-image: url(../images/banner.jpg);
}
.banner .bn {
position: absolute;
height: 60px;
width: 1000px;
background-color: #41403e;
filter: alpha(opacity=47);
}
.bn .logo {
float: left;
}
.nav{
height:24px;
width:900px;
float: right;
margin-top: 18px;
}
.nav li{
text-align:center;
float:right;
padding-right:15px;
color:#fff;
padding-left: 30px;
font-size: 14px;
} 展开
展开全部
你可以把背景做成半透明的png格式的图片,这样就不需要用滤镜设置透明度了。
filter本来就是会影响子元素的。
filter本来就是会影响子元素的。
追问
PNG的话是不是只有IE支持啊?
追答
css的滤镜属性是只有IE支持的。其他浏览器要写单独的样式实现。
而PNG只有ie6支持的不好,不过也有解决办法。在ie6下png的透明不能实现,只需添加一段js代码就可以了。网上有很多关于“ie6 png 透明”的js代码。
我给你提供一个www。htmlcss8。com/png.js(句号换成点,直接下载就行了。)
然后在你的页面中添加下面的代码。这样ie6下png的透明都能正常显示了。
DD_belatedPNG.fix('div, ul, p, address, h2, img, li, input,a');
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询