麻烦老师帮忙检查一下
来源:2-2 编程练习
老二次
2020-02-07 13:41:48
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>IMOOC</title>
<style type="text/css">
* {margin: 0;padding: 0;}
header a { text-decoration: none;color: #fff;}
header {width: 100%;height: 80px;background-color: #000;}
header > a {position: relative;left: 260px;top: 0;height: 80px;display: inline-block;}
header > a > img {position: relative;float: left;top: 50%;left: 0;margin-top: -20px;}
header p {display: inline-block;line-height: 95px;font-size: 24px;}
header nav {font-size: 0px;display: inline-block;float: right;margin-right: 200px;}
header > nav > a {display: inline-block;width: 110px;height: 73px;line-height: 73px;text-align: center;font-size: 20px;position: relative;right: 0;top: 0;}
header > nav a:nth-child(1) {background-color: #D40112;padding-bottom: 7px;}
header > nav a:nth-child(2) {background-color: #FEB800;}
header > nav a:nth-child(3) {background-color: #78B917;}
header > nav a:nth-child(4) {background-color: #433B90;}
header > nav a:nth-child(5) {background-color: #F27C01;}
header > nav a:nth-child(6) {background-color: #017FCB;}
header > nav a:hover,
header > nav a:active {
padding-bottom: 7px;
}
</style>
</head>
<body>
<!-- 在此完成网页的HTML代码-->
<header>
<a href="3-2-2.html">
<img src="http://climg.mukewang.com/582e5f160001b17100400040.png">
<p> MYMOOC</p>
</a>
<nav>
<a href="3-2-2.html">Home</a>
<a href="#">Course</a>
<a href="#">Actual</a>
<a href="#">Plan</a>
<a href="#">FAQ</a>
<a href="#">Notes</a>
</nav>
</header>
</body>
</html>
1回答
同学你好,代码实现效果很棒!继续加油,祝学习愉快!
相似问题