列表除了用于组织HTML内容以外，还经常与CSS一起用于制作各种导航效果。本节将介绍如何使用无序列表和CSS制作横向导航条。

新建一个HTML页面，在代码视图中编写如下代码：

这段代码在浏览器中的显示效果如图5.24所示。

设置无序列表的CSS样式，去掉列表前的小圆点，相关代码如下所示：

刷新浏览器后的效果如图5.25所示。

设置列表项横向浮动，并设置字体颜色，相关代码如下所示：

刷新浏览器后的效果如图5.26所示。