用html和CSS绘制网页的导航栏

导航栏是页面重要的一部分，本节向大家展示双行导航栏的编写，基于该模板可以DIY自己的导航栏，改变内容、颜色、背景等。

现给出代码中比较重要的部分，并对其展示出来的效果做解释。

本文代码呈现出导航栏的形式是，由一个一个小块堆砌而成，导航栏由小块堆成两行。

将一行视为一个整体，使用<ul>标签，每行中的各个小块使用<li>标签。本文的导航栏有两行，因此要使用两个<ul>标签。

为了将小块严格对齐，一定要设置每个小块的宽度，宽度在<li>标签中设定。

html5中增加了<nav>标签，使整个结构更加清晰。在html以前的版本中，nav用<div id="nav">来表示。

ul列表默认形式为纵列显示，如果要将小块横向排列的话，需要将li设置一些属性，float:left；position:relative。

仅仅这样设置还不够，要将小块另起一行，还要将li的float:left格式清除，因此要设置ul表的CSS样式，在每个ul表显示之后，清除样式，不对下一个ul表产生影响。

.clear:after {
clear: both;
content: ".";
display: b