用CSS编写一个网页导航栏
日期：2013-07-06 浏览次数：21164 次
列表标签:
<ul id="bar">
<li><a href="#">导航标题</a></li>
<li><a href="#">导航标题</a></li>
<li><a href="#">导航标题</a></li>
<li><a href="#">导航标题</a></li>
<li><a href="#">导航标题</a></li>
</ul>
相应CSS:
#bar{
list-style:none;
}
#bar li{
float:left;
}
#bar li a{
float:left;
padding:7px 10px;
border:1px solid #444;
margin:5px;
background-color:#666;
color:#C00;
}
#bar li a:hover{
color:#CF0;
background-color:#444;
}
<ul id="bar">
<li><a href="#">导航标题</a></li>
<li><a href="#">导航标题</a></li>
<li><a href="#">导航标题</a></li>
<li><a href="#">导航标题</a></li>
<li><a href="#">导航标题</a></li>
</ul>
相应CSS:
#bar{
list-style:none;
}
#bar li{
float:left;
}
#bar li a{
float:left;
padding:7px 10px;
border:1px solid #444;
margin:5px;
background-color:#666;
color:#C00;
}
#bar li a:hover{
color:#CF0;
background-color:#444;
}
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
