css html float 可折叠菜单
我用CSS + DL、DD做二级可折叠菜单,但二级菜单总是重叠在一起~请教大家我的CSS里面还应该加什么东西才能让他不重叠在一起?
HTML代码:
登录后复制登录后复制测试测试1测试测试测试测试1测试测试测试测试1测试测试
CSS在下面:
- ul, li, dl, dt, dd{list-style: none outside none;margin: 0px;padding: 0px;}.nav_dl{position: relative;float: left;margin-left: 35px;}.nav_dl dt{float: left;width: 100px;height: 45px;}.nav_dl dd{position: absolute;top: 45px;width: 100px;color: #606060;border: 2px solid #CC0000;}
登录后复制
回复讨论(解决方案)
.nav_dl dd
{
position: absolute;
top: 45px;
width: 100px;
color: #606060;
border: 2px solid #CC0000;
}
你因为你用了绝对定位,top是一样的,所以重叠在一起了
.nav_dl dd
{
position: absolute;
top: 45px;
width: 100px;
color: #606060;
border: 2px solid #CC0000;
}
你因为你用了绝对定位,top是一样的,所以重叠在一起了
可是如果把绝对定位去掉,让dd元素回归文档流,并把top去掉,那就变成这样了:
引用 1 楼 bbjbepzz 的回复:.nav_dl dd
{
position: absolute;
top: 45px;
width: 100px;
color: #606060;
border: 2px solid #CC0000;
}
你因为你用了绝对定位,top是一样的,所以重叠在一起了
可是如……
我想要二级菜单都在一级下面,然后我再加程序让他在鼠标滑过的时候自动出来
你的结构不正确,所以CSS不好设置,正确的结构应该是
登录后复制登录后复制测试测试1测试测试测试测试1测试测试测试测试1测试测试
这样你再设置CSS就会生效了,不会重叠了