效果如下：
实现方法：利用一下两张图片：
前台代码：
<div id="nagivation">
<ul >
<li ><a href="mainbooks.aspx"><b>首页</b></a></li>
<li ><a href ="bookstoretop.aspx?topid=1"><b>文学</b></a></li>
<li ><a href ="bookstoretop.aspx?topid=2"><b>小说</b></a></li>
<li ><a href ="bookstoretop.aspx?topid=3"><b>艺术</b></a></li>
<li ><a href ="bookstoretop.aspx?topid=4"><b>管理</b></a></li>
<li ><a href ="bookstoretop.aspx?topid=5"><b>考试</b></a></li>
<li ><a href ="bookstoretop.aspx?topid=6"><b>工具书</b></a></li>
<li ><a href ="bookstoretop.aspx?topid=7"><b>科技</b></a></li>
</ul>
&
1、不要使用过小的图片做背景平铺。这就是为何很多人都不用 1px 的原因，这才知晓。宽高 1px 的图片平铺出一个宽高 200px 的区域，需要 200*200=40, 000 次，占用资源。
2、无边框。推荐的写法是 border:none;，哈哈，我一直 ......
事实上，所有表现的地方都需要用CSS来实现。我们以前都习惯用table来定位和布局，现在要改用DIV来定位和布局。这是思维方式的变化，一开始有些不习惯。呵呵，任何变革都会有阻力的，为了享受标准带来的"益处"，放弃一些老的传统做法是值得的。
外部调用样式表
在以前，我们通常采用2种方法使用样式表：
......
1.所有的标记都必须要有一个相应的结束标记
以前在HTML中，你可以打开许多标签，例如<p>和<li>而不一定写对应的</p>和</li>来关闭它们。但在XHTML中这是不合法的。XHTML要求有严谨的结构，所有标签必须关闭。如果是单独不成对的标签，在标签最后加一个"/"来关闭它。例如:
<br />&l ......
