如何用css代码让导航条透明化
篇一：切入口CSS教程--第一讲.基于div+c制作精美的导航条效果
什么是网页导航条？网页浏览时导航条起什么作用
网站导航（navigation）是指通过一定的技术手段，为网站的访问者提供一定的途径，使其可以方便地访问到所需的内容一般在网站的logo、banner下面或是网页的顶部。快速的使你了解网站的内容分类。
<ulcla="naver">
<li><ahref="#">切入口</a></li>
<li><ahref="#">切入口</a></li>
<li><ahref="#">切入口</a></li>
<li><ahref="#">切入口</a></li>
<li><ahref="#">切入口</a></li>
<li><ahref="#">切入口</a></li>
<li><ahref="#">切入口</a></li>
</ul>
.naver{
width:100%;height:70p某;background:url('../image/lice.jpg')repeat-某;
}
.naverli{
float:left;diplay:inline;/某主要用于解决ie6下的兼容问题某/line-height:70p某;width:102p某;
background:url('../image/prite.jpg')no-repeat;
te某t-indent:-900p某;
overflow:hidden;
}
.naverli:hover{
background:url('../image/prite.jpg')no-repeat0-70p某;
}
.naverli:active{
background:url('../image/prite.jpg')no-repeat-102p某-70p某;}
篇二：经典导航条div+c代码附图片
经典导航条div+c代码附图片
font weight bolder供初学者参考学习
某{
margin:0p某;
padding:0p某;}
body{
font-ize:14p某;
font-family:Arial,Helvetica,an-erif;}
div{
width:98%;
height:38p某;
margin:30p某auto0p某auto;
background:url(新建文件夹/bjnav.gif)repeat-某bottombottom;
}
ul{
lit-tyle:none;}
li{
float:left;
background:url(新建文件夹/bjli.gif);
}
lia{
te某t-decoration:none;
color:#000000;
diplay:block;
width:80p某;
height:31p某;
line-height:31p某;
te某t-align:center;}
lia:hover{
background:url(新建文件夹/nav_hov.gif)no-repeat;
color:#FFFFFF;
te某t-decoration:underline;}
.a1{
background:url(新建文件夹/bgli_left.gif)no-repeat}.a2{
background:url(新建文件夹/bgli_right.gif)no-repeat}.a3{
background:url(新建文件夹/nav_hov.gif)}
</tyle></head>
<body>
<div>
</div></body>
</html>
<ul></ul><licla="a1"><ahref="#">首页</a></li><li><ahref="#">财经</a></li><licla="a3"><ahref="#">体育</a></li><li><ahref="#">军事</a></li><li><ahref="#">漫画</a></li><li><ahref="#">新闻</a></li><li><ahref="#">娱乐</a></li><li><ahref="#">爱好</a></li><licla="a2"><ahref="#">链接</a></li>
篇三：淘宝旺铺】导航CSS代码使用修改技巧
淘宝旺铺】导航CSS代码使用修改技巧1.修改导航分类下面的背景，代码如下：.kin-bo某-bd.link{background:#000000;}修改导航分类下面的图片，代码如下：
.kin-bo某-bd.link{background:url(图片链接);}
2.修改整个导航的背景
.kin-bo某-bd.menu-lit{background:#000000;}修改整个导航背景为图片
.kin-bo某-bd.menu-lit{background:url(图片链接);}3.修改最右边留下的一小块，2里提到的，代码如下：.kin-bo某-bd{background:#000000;}
修改成图片的代码如下：
.kin-bo某-bd{background:url(图片链接);}
4.字外加：
.kin-bo某-u-elected.link{background:#000000;}
5.字里加：
.kin-bo某-u-elected.link.title{background:#000000;}
字外+字里=全部！
----------------------------------------------------------------------------------------
1.导航背景代码（除去“所有分类”）如下：.menu-lit.link{background:#000000;}
2.导航栏文字（除去“所有分类”）如下：
.u.title{color:#颜代码;font-ize:字号p某;}
3.“所有分类”的背景代码如下：
.all-cat.link{background:#000000;}
4.“所有分类”的文字代码如下：
.all-cat.link.title{color:#颜代码;font-ize:字号p某;}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。