html绝对定位重叠,怎么消除css中的绝对定位重叠问题

满意答案

liangfansz

2017.12.25

采纳率：55%    等级：12

已帮助：7193人

首页打开dreamweaver或其它编辑器，创建一个名为nav的导航菜单

• 栏目一
• 栏目二
• 栏目三
• 栏目四
• 栏目五

现在为nav添加样式,首先去掉默认的margin和padding，再去掉

• < li>标签的list-style样式和

标签的默认下划线。接下来再添加适当的样式(根据实际需要添加)进行美化，如一下样式：

* { margin:0; padding:0;}

ul, li { list-style:none;}

a { text-decoration:none;}

.nav { border:2px solid #ccc; border-right:none; overflow:hidden; float:left; margin:100px 0 0 300px;}

.nav ul li { float:left;}

.nav

ul li a

{ width:120px; height:40px; text-align:center; line-height:40px; display:block; border-right:2px

solid #ccc; background:#eee; color:#666;}

.nav ul li a:hover{ color:#f00; }

像这样，一个菜单横向菜单就建好了，下面给栏目一，栏目二，栏目三，添加二级下拉菜单

添加完二级栏目后，现在开始添加css样式，首先给

标签下的 标签添加相对定位，再去除之下标签的做浮动样式，再适当修改