请老师检查一下，谢谢！
来源：2-2 编程练习
慕斯卡7334333
2019-10-22 22:58:16
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>IMOOC</title>
<style>
*{margin:0;padding:0;border:none;}
a{text-decoration:none;color:white;}
ul{list-style:none;}
header{background:black;height:80px;}
header .container{width:1200px;margin:0 auto;}
header .container > a{font-size:25px;display:block;float:left;margin:20px 25px;}
header .container nav{float:right;}
header .container nav > a {display:block;float:left;font-size:20px;height:73px;width:110px;line-height:73px;text-align:center;}
header .container nav > a.Home{background:#433b90;}
header .container nav > a.Course{background:#017fcb;}
header .container nav > a.Actual{background:#78b917;}
header .container nav > a.Plan{background:#feb800;}
header .container nav > a.FAQ{background:#f27c01;}
header .container nav > a.Notes{background:#d40112;}
header .container nav > a:hover,
header .container nav > a.active{
padding-bottom:7px;
}
</style>
</head>
<body>
<!-- 在此完成网页的HTML代码-->
<header>
<div class="container">
<a href="#"><img src="http://climg.mukewang.com/582e5f160001b17100400040.png">MYMOOC</a>
<nav>
<a class="Home active" href="#">Home</a>
<a class="Course" href="#">Course</a>
<a class="Actual" href="#">Actual</a>
<a class="Plan" href="#">Plan</a>
<a class="FAQ" href="#">FAQ</a>
<a class="Notes" href="#">Notes</a>
</nav>
</div>
</header>
</body>
</html>
1回答
-
同学你好，LOGO部分的高度溢出了父级。
建议：可以调整a标签的上下margin值。
其他地方实现不错，继续加油哦
祝学习愉快~
0
相似问题