abstrait:<!DOCTYPE html><html><head> <title>天貓精選-上天貓,就夠了</title> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="st
<!DOCTYPE html>
<html>
<head>
<title>天貓精選-上天貓,就夠了</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="static/css/style.css">
<link rel="shortcut icon" type="image/x-icon" href="static/images/logo1.png">
<link href="static/font-awesome/css/font-awesome.min.css" rel="stylesheet">
<style>
*{margin: 0px;padding: 0px;}
ul{list-style: none;}
a{text-decoration: none;color: #6D6E6A;}
body{font-size: 12px;}
.top{background: #f2f2f2;height: 35px;}
.content{height: 35px;line-height: 35px;width: 1300px;margin: 0px auto;}
.left{width: 300px;float: left;}
.left a{margin-right:17px;}
.right{float: right;}
.right li{float: left;margin-right:17px;position:relative; }
.right li i{color: red;}
.content a:hover{color: red;}
.right li div{box-shadow: 2px 1px 5px #ccc;background: #fff;text-align: center;display:none; }
.number{width: 115px;position: absolute;left: 0px;top:35px;line-height: 23px;padding: 10px 0px; }
.dope{width: 100px;position:absolute; left: 0px;top:35px;line-height: 23px;padding: 10px 0px; }
#website{width: 1300px;height: 250px;position: absolute;right: 0px;top: 35px;}
.right li:hover div{display: block;}
</style>
</head>
<body>
<div class="top">
<div class="content">
<div class="left">
<a href=""> 喵,歡迎來到天貓</a>
<a href="">請登錄</a>
<a href="">免費注冊</a>
</div>
<div class="right">
<ul class="">
<li><a href="">我的淘寶</a>
<div>
<a href=""></a></div><br>
<a href=""></a>
</div>
</li>
<li><a href="">我關(guān)注的品牌</a></li>
<li><a href="">我收藏的寶貝</a></li>
<li><a href="">手機版</a></li>
<li><a href="">淘寶網(wǎng)</a></li>
<li><a href="">網(wǎng)頁導(dǎo)航</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>
Professeur correcteur:滅絕師太Temps de correction:2019-02-11 09:20:59
Résumé du professeur:要想布局迅速,就要理解每個標(biāo)簽和屬性的用意