从本章开始我们将深入到网页设计的细节层面去了解各个元素的使用，网站设计通过多年的发展与积累，除了技术上的革新性变化之外，设计理论上也有了很大的突破，从早期的分栏式布局开始，我们对网站设计中的各个区域进行了人为了定义与分类，以加强网页规范与可用性。目前网站上常用的页面元素主要有网站导航、站点地图、内容列表、表单等多种元素，早起使用HTML的表格式布局来设计这些元素，无非是通过表格的各种单元格细分来实现预期效果。而采用符合标准的CSS布局之后，对于页面元素来说拥有了更多丰富可定义的效果。如列表元素，由于之前CSS控制能力并不突出，HTML中原本用于显示列表的ul及ol元素被弃而不用，取而代之的是Table表格进行多行划分来实现列表的效果，用table实现相同的效果相对于ul与ol元素来说代码过于复杂，单元格之间标签较多，并不是理想的选择。本章中就将就此类问题也行实例探讨，通过最简便的途径，实现页面中的各种元素样式。
天津网站建设，天津网站优化，汽车玻璃，天津二手装载机，商业策划招商
4.1用CSS设计网站导航钢板桩租赁，天津废锡回收
网站导航是网站中最重要的元素，是网站提供给用户的最直接最方便的访问网站内容的工具。网站导航从形式上主要由横向导航、纵向导航、下拉及多级菜单导航等3种常见形式。
MSN.com新版网站采用简洁的横向导航。
Mailfrontier网站采用带图标的横向导航。
Amazon.com拥有标签式的横向导航，以及大面积的下拉菜单。左侧还有纵向的分类导航。
Marcromedia.com采用二级交互式导航菜单。
横向导航 作为门户网站的设计而言，主导航一般采用横向导航。由于门户网站下方文字较多，且每个频道均有不同的样式区分，因此在顶部固定一个区域设计统一风格且不占用过多空间的导航是最理想的选择，MSN.com,Yahoo.com以及国内新浪、网页、闪客帝国等网站均采用此导航形式。
纵向导航 目前在门户网站的设计中已经不再流行，纵向导航更倾向与表达产品分类，如Amazon.com左侧提供了纵向导航对全站的商品进行索引帮助用户寻找，国内的淘宝、易趣等网站也在页面中使用这种导航形式进行分类浏览。
下拉导航 主要用于功能复杂的网站。上图中的Amazon.com提供了下拉式导航帮助用户寻找产品分类，一些知名软件爱你公司如Macromedia也提供下拉式导航帮助用户在导航上直接找到产品的相关内容。
总的来说导航的核心目标是设计一个简便快捷的操作入口，帮助用户快速到达网站中的内容，设计上应当根据网站类型及内容的需求设计合理的导航形式。这里我们将使用CSS对常用的三种导航形式进行设计，看看CSS是如何实现这些样式的。