导航栏

 

    熟练使用导航栏，对于任何网站都非常重要。

 

    使用CSS你可以转换成好看的导航栏而不是枯燥的HTML菜单。

 

    导航栏=链接列表

 

    作为标准的HTML基础一个导航栏是必须的

 

    。在我们的例子中我们将建立一个标准的HTML列表导航栏。

 

    导航条基本上是一个链接列表，所以使用<ul>和<li>元素非常有意义：

 

    实例

 

<ul>

 

  <li><a href="#home">主页</a></li>

 

  <li><a href="#news">新闻</a></li>

 

  <li><a href="#contact">联系</a></li>

 

  <li><a href="#about">关于</a></li>

 

</ul>

 

    现在，让我们从列表中删除边距和填充：

 

    实例

 

ul {

 

    list-style-type: none;

 

    margin: 0;

 

    padding: 0;

 

}

 

    例子解析：

 

    list-style-type:none-移除列表前小标志。一个导航栏并不需要列表标记

 

    移除浏览器的默认设置将边距和填充设置为0

 

    上面的例子中的代码是垂直和水平导航栏使用的标准代码。