麻烦老师看看代码是否正确，是否需要完善精简？谢谢
来源：2-4 编程练习
MemoryNic
2019-08-06 14:13:29
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*此处写代码*/
* {margin:0;
padding:0;
color:white;
font: bold 18px "微软雅黑";}
a {text-decoration:none;}
ul {list-style:none;}
.header {width:1100px;
height:100px;
background:black;
margin:0 auto;}
.logo {width:300px;
float:left;
margin-left:0;}
.nav {float:right;
padding-top:30px;}
li {display:inline-block;
margin:5px 30px;}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="header">
<div class="logo">
<a href="#"><img src="http://climg.mukewang.com/58c0d2d900016ce303000100.png"/></a>
</div>
<div class="nav">
<ul>
<a href="#"><li>课程</li></a>
<a href="#"><li>职业路径</li></a>
<a href="#"><li>实战</li></a>
<a href="#"><li>猿问</li></a>
<a href="#"><li>手记</li></a>
</ul>
</div>
</div>
</body>
</html>
1回答
-
同学你好！
代码有需要优化的地方（1）logo图片超出了父级，这是因为img标签本身存在间隙，解决方法是将img的display属性设置为block
（2）右侧导航，建议使用li包括a标签，块级标签包括内联标签
同学可以根据此思路再修改下
如果帮助到了你 欢迎采纳 祝学习愉快~
0
相似问题