以下是引用片段：
<style type="text/css">
<!--
body{
margin:0px;
padding:0px;
font:12px/20px "宋体";
}
.nav{
width:160px;
margin-left:100px;
float:left;
margin-top:30px;
overflow:hidden;
display:inline;
}
.nav ul{
float:left;
width:100%;
margin:0px;
padding:0px;
list-style:none;
border-bottom:#999 dashed 1px;
}
.nav a{
color:#000000;
background:#e7e7e7;
border:#999 dashed 1px;
border-bottom:none;
padding:5px 5px 5px 30px;
display:block;
}
<!-- 从块级元素变成行内元素，消除导航栏上每个链接之间的空间。 -->
.nav li{
display:inline;
}
<!-- 这个样式利用* html hack，把CSS属性只应用给IE6和更早的版本。IE7完全忽略这个规则，就像所有其他浏览器一样。这个样式声明本身没有意义，它企图设置链接的高度为1px，这是IE忽略的东西，但是它强制浏览器把按钮的背景颜色当成链接的一部分。 -->
* html .nav a{
height:1px;
}
.project a.projectlink,
.quiz a.quizlink,
.expert a.expertlink,
.home a.homelink,
.baidu a.baidulink{
background:#FF33FF;
}
.nav a:link{
color:#000;
text-decoration:none;
}
.nav a:visited{
color:#000;
text-decoration:none;
}
.nav a:hover{
font-weight:bold;
color:#3333CC;
background:#FFCCCC;
text-decoration:none;
}
-->
</style>
<body class="home">
<div class="nav">
<ul>
<Li><a href="http://www.163.com" class="homelink">首页</a></Li>
<li><a href="http://www.163.com" class="expertlink">公司简介</a></li>
<li><a href="http://www.baidu.com" class="baidulink">产品展示</a></li>
<li><a href="http://www.163.com" class="quizlink">联系我们</a></li>
<li><a href="http://www.163.com" class="projectlink">招贤纳士</a></li>
</ul>
</div>
</body>
|
