欢迎来到Doc100.Net免费学习资源知识分享平台!
您的位置:首页 > 程序异常 >

不透明内容透明背景嵌套透明背景不透明内容。css求大神帮忙看看错哪了,只能显示第一个li的文字,后面三个都看不到

更新时间: 2014-01-05 00:53:36 责任编辑: Author_N1

 

不透明内容透明背景嵌套透明背景不透明内容。css求大神帮忙看看哪里错了,只能显示第一个li的文字,后面三个都看不到。
.navigation{width:100%; height:75px; text-align:center; margin:0 auto; margin-top:6px;}
.nav{  background:#fff; position:relative; overflow:hidden;  height:75px; opacity:0.3;-moz-opacity:0.3; -webkit-opacity:0.3;filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=30); z-index:-2; }
.naviga{  z-index:2; margin-top:-75px; height:75px; position:relative;  }
.nav_li  ul{ width:880px; margin:0 auto;}
.navtext{ width:880px; margin:0 auto;}
.nav_li{ height:55px;}
.nav_li li{ position:relative; overflow:hidden; opacity:0.5;-moz-opacity:0.5;-webkit-opacity:0.5; height:50px;filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=50); z-index:-1;margin-right:45px; float:left; background:#fff; }/***背景透明***/
.nav_li ul li a{ font-size:36px; line-height:50px; color:#fff; padding:4px 10px; font-weight:600;  }
.navtext{ height:55px; position:inherit; margin-top:-55px;}
.navtext li{position:relative;  margin-right:45px; float:left; z-index:4;margin-top:-55px;}
.navtext ul li a{font-size:36px; line-height:50px; color:#fff; padding:4px 10px; font-weight:600;  }

html为:

<div class="navigation">
<div class="nav"></div>
             <div class="naviga">
     <div class="nav_li">
                         <ul>
                             <li><a href="#">世界呐喊</a></li>
                                <li><a href="#">世界呐喊</a></li>
                                   <li><a href="#">世界呐喊</a></li>
                                       <li><a href="#">世界呐喊</a></li>
          </ul>
          </div>
                     <div class="navtext">
                         <ul>
                             <li><a href="#">世界呐喊</a></li>
                                <li><a href="#">世界呐喊</a></li>
                                   <li><a href="#">世界呐喊</a></li>
                                       <li><a href="#">世界呐喊</a></li>
          </ul>
          </div>
     </div>
    </div>

--参考方法--
color: white; 字体设置了
上一篇:上一篇
下一篇:下一篇

 

随机推荐程序问答结果

 

 

如对文章有任何疑问请提交到问题反馈,或者您对内容不满意,请您反馈给我们DOC100.NET论坛发贴求解。
DOC100.NET资源网,机器学习分类整理更新日期::2014-01-05 00:53:36
如需转载,请注明文章出处和来源网址:http://www.doc100.net/bugs/t/1097/
本文WWW.DOC100.NET DOC100.NET版权所有。