一般css排版会采用ul + a 的方式实现,css代码如下:

<style>

#header{
 width:802px;
 height:98px;
 background:url(img/headerbg.gif);
}
#nav { 
  height:26px;  
  list-style:none;
  float:right;
  margin-top:72px;
}
#nav li{
 float:left; 
 font-size:14px;
 font-weight:bold;
}
#nav li a{
 color:#FFFFFF;
 text-decoration:none;
 padding-top:7px;
 display:block;
 width:97px;
 height:19px;
 text-align:center;
 background:url(img/nav.gif); 
 margin-left:2px;
}
#nav li a:hover{
 background:url(img/nav.gif);
    background-position:0px -26px;
 color:#FFFFFF;
}
#nav li a#current{
 background:url(img/nav.gif);
    background-position:0px -52px;
 color:#000000;
}
</style>

</head>

<body>

<div id="header">
 <ul id="nav">
  <li><a href="#" id="current">首 页</a></li>
  <li><a href="#">文 章</a></li>
  <li><a href="#">参 考</a></li>
  <li><a href="#">Blog</a></li>
  <li><a href="#">论 坛</a></li>
  <li><a href="#">联 系</a></li>
 </ul>
</div>
</body>
</html>