为什么我的三级目录不能挤到二级目录里?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{padding:0;margin:0;}
.nav{
width:160px;
height:auto;
position:fixed;
left:0;
top:50%;
margin-top:-101px;
font-family:"microsoft yahei";
}
.nav-li{
width:160px;
background:#333;
color:#fff;
height:auto;
line-height:40px;
font-size:16px;
border:0.5px solid #fff;
text-align:center;
}
.tit{
width:160px;
height:40px;
}
li{
width:160px;
height:40px;
text-align: center;
line-height:40px;
background:#fff;
color:#333;
border-bottom:1px dashed #333;
}
ul{display:none;}
.nav-li:hover ul{display:block;}
.li-3{
width:160px;
height:auto;
}
.li-3dom{
width:160px;
height:40px;
text-align:center;
line-height:40px;
background:#333;
color:#fff;
border-bottom:1px solid #333;
}
</style>
</head>
<body>
<div class="nav">
<div class="nav-li">
<div class="tit">慕课网导航</div>
<ul>
<li>
二级栏目
<div class="li-3">
<div class="li-3dom">三级栏目</div>
<div class="li-3dom">三级栏目</div>
<div class="li-3dom">三级栏目</div>
</div>
</li>
<li>
二级栏目
</li>
<li>
二级栏目
</li>
</ul>
</div>
<div class="nav-li">
<div class="tit">慕课网导航</div>
<ul>
<li>
二级栏目
</li>
<li>
二级栏目
</li>
<li>
二级栏目
</li>
</ul></div>
<div class="nav-li">
<div class="tit">慕课网导航</div>
<ul>
<li>
二级栏目
</li>
<li>
二级栏目
</li>
<li>
二级栏目
</li>
</ul></div>
<div class="nav-li">
<div class="tit">慕课网导航</div>
<ul>
<li>
二级栏目
</li>
<li>
二级栏目
</li>
<li>
二级栏目
</li>
</ul></div>
<div class="nav-li">
<div class="tit">慕课网导航</div>
<ul>
<li>
二级栏目
</li>
<li>
二级栏目
</li>
<li>
二级栏目
</li>
</ul>
</div>
</div>
</body>
</html>为什么我的三级目录不能像讲师的视频中演示的那样 讲二级目录覆盖 反而是二级目录将三级目录覆盖了呢?
90
收起
正在回答
2回答

把这个背景颜色去掉就可以了。
前端小白入门系列课程
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36712 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程

恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星