第四天 纵向导航菜单和二级弹出菜单

3、argin:0px;padding:0px;}下面我们定义一下全局的字体，字号，行距等，点击css样式面板上的新建按钮，在弹出的窗口中选择器类型选择标签，名称选择body，然后在css编辑器中设置如下图所示属性body全局样式定义后，下面我们给#menu定义一个灰色的1px边框及宽度，然后把li定义下背景色和下边框及内边距等接下来定义li的背景色为浅灰色及下边框和内边距这些属性设置完后，一个简单的纵向列表菜单初具模型了。因为导航菜单，需要链接到其它页面，下边把这些导航加上链接，然后在定义a的状态和鼠标划过状态。要添加链接，先选择要

4、添加链接的文字，然后在属性页面链接上输入要链接的页面址，我这里输入个#，是个虚拟链接，不指向任何页面。创建a的样式后，下面我们增加个交互效果，当鼠标划过链接文字时，让文字颜色变成红色，这时就需要用到a:hover这个伪类了这里的a:hover属于伪类，在下一章节时会详细讲解，或者参看http://www.aa25.cn/div_css/882.shtml，这里只要知道这个写法是定义鼠标划过时的样式就可以了源代码如下：

5、w.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">body{font-family:Verdana;font-size:12px;line-height:1.5;}a{color:#000;text-decoration:none;}

6、a:hover{color:#F00;}#menu{width:100px;border:1pxsolid#CCC;}#menuul{list-style:none;margin:0px;padding:0px;}#menuulli{background:#eee;padding:0px8px;height:26px;line-height:26px;border-bottom:1pxsolid#CCC;}

• 首页

  7、i>

• 网页版式布局
• div+css教程
• div+css实例
• 常用代码
• 站长杂谈
• 技术文档
• 资源下载
• 图片素材