请老师检查
来源：2-8 编程练习
你怎么睡得着的
2022-04-11 09:45:04
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
/*在此处补充代码*/
* {
margin: 0;
padding: 0;
}
li {
list-style: none;
}
header {
background-color: #000;
justify-content: space-around;
}
header,
.nav,
.login {
display: flex;
align-items: center;
}
.logo img {
display: block;
}
.nav li {
margin-right: 100px;
color: aliceblue;
}
.login input {
margin-right: 20px;
background-color: orange;
color: #fff;
border: none;
border-radius: 10%;
}
</style>
</head>
<body>
<header>
<div class="logo">
<img src="http://climg.mukewang.com/59feb59700019dab01910057.png" alt="">
</div>
<ul class="nav">
<li>课程</li>
<li>路径</li>
<li>猿问</li>
<li>手记</li>
</ul>
<div class="login">
<input type="button" value="登录">
<input type="button" value="注册">
</div>
</header>
</body>
</html>
1回答
-
同学你好，整体思路是可以的，不过有些细节需要调整，如下：
1、通过检查元素可知，.nav和.login盒子中的内容具体盒子的左右侧间距不同，导致内容水平居中存在误差，如图：
建议修改：去掉最后一个元素的右外边距
2、按钮中的文字四周缺少间距，效果不美观，如图：
建议：设置padding适当调整间距
祝学习愉快~
0
