老师,麻烦你帮我看看
来源:2-2 编程练习
陈孝芳
2019-10-25 13:32:13
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>IMOOC</title>
<style type="text/css">
*{
padding:0;
margin:0;
border:none;
font-family:Arial;
font-size:14px;
color:#fff;
}
a{
text-decoration:none;
}
header{
height:80px;
background:black;
}
header > .container{
width:1200px;
margin:0 auto;
}
header > .container > a{
display:block;
float:left;
margin:20px 20px;
}
header > .container > nav{
float:right;
}
header > .container > nav a{
display:block;
float:left;
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="Notex" href="#">Notes</a>
</nav>
</div>
</header>
</body>
</html>
</body>
</html>
1回答
好帮手慕言
2019-10-25
同学你好,测试同学提供的代码,有以下问题哦。
1、代码中少了一个花括号。
正确书写为下:
2、导航项的最后一个没有样式。如下图:

原因是类名书写的有问题。
建议:html和css中的类名要一致。
代码参考:
祝学习愉快~