1、1.div+css制作简单导航菜单，首先看效果图：
2、2.代码如下：
首先建立 4个超链接
3、3.预览效果：
4、4.添加如下样式：
5、5.预览效果：
6、6.发现链接竟然是竖着排列的，这是因为display:block的属性决定的，现在把a标签这个行内元素变为了块级元素，而每个块级元素默认是占满整个一行的（无论多宽），后边的元素会另起一行。
那现在要让他们一行展示怎么办？很简单，加个属性float:left;
7、7.预览效果：
8、8.好吧，效果出来了，但这样式……
美化一下，让每个链接都有个间距，而且文字居中。
9、9.预览效果：
10、10.再次美化，给它加个滑动的效果，而且去除下划线
11、11.最终预览效果：
12、12.简单吧，其实所有的链接效果的基本原理都是这个，更炫酷一点的无非是给它增加几个背景图片而已！