2-4 烦请老师检查,谢谢
来源:2-4 编程练习
Miki未希
2020-05-25 00:20:48
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*此处写代码*/
*{margin:0;padding:0}
.containter{width:1100px;
height:100px;
background:black;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
margin:auto;}
div .logo{float:left;}
div .nav{list-style:none;
float:right;
line-height:100px;
text-align:center;
}
a{text-decoration:none;
color:white;}
div .nav li{display:inline-block;
font-size:20px;
font-family:"微软雅黑";
margin-right:30px;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="containter">
<a href="#"><img class="logo" src="http://climg.mukewang.com/58c0d2d900016ce303000100.png"/></a>
<ul class="nav">
<li><a href="#">课程</a></li>
<li><a href="#">职业路径</a></li>
<li><a href="#">实战</a></li>
<li><a href="#">猿问</a></li>
<li><a href="#">手记</a></li>
</ul>
</div>
</body>
</html>1回答
好帮手慕小鱼
2020-05-25
同学你好,ul列表高度超出整个导航条所设高度,如下

由于将li转换为了行内块,所以li会带有行内元素的特点,存在默认间距。
建议:如果想要让li排列在一行,可以通过浮动实现。此时li默认是块元素,就不会存在默认间隙了
具体参考如下:

如果我的回答帮助了你,欢迎采纳。祝学习愉快~
相似问题