<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>作业</title>
<style>
#father {
width: 1046px;
height: 646px;
border: 3px rebeccapurple solid;
}
#d1 {
width: 1000px;
height: 50px;
border: 3px red solid;
margin-top: 10px;
margin-left: 20px;
margin-right: 20px;
}
ol li {
list-style-type: none;
float: left;
}
a:hover {
color: red;
}
#d2 {
width: 300px;
height: 150px;
border: 3px blue solid;
position: relative;
top: 10px;
left: 20px;
}
#d3 {
width: 300px;
height: 150px;
border: 3px blue solid;
position: relative;
top: 20px;
left: 20px;
}
#d4 {
width: 300px;
height: 150px;
border: 3px blue solid;
position: relative;
top: 30px;
left: 20px;
}
#d5 {
width: 680px;
height: 480px;
border: 3px blue solid;
position: absolute;
top: 88px;
left: 350px;
right: 20px;
}
#d6 {
width: 1000px;
height: 50px;
border: 3px red solid;
position: relative;
top: 40px;
left: 20px;
right: 20px;
}
#d7 {
border: 3px rebeccapurple solid;
border-radius: 20px;
position: fixed;
top: 90%;
left: 88%;
}
#g {
width: 40px;
height: 40px;
border: 3px black solid;
border-radius: 50%;
position: relative;
left: 20px;
top: 20px;
background-image: url("D:/web/1.png");
}
#w {
width: 80px;
height: 20px;
position: relative;
left: 60px;
top: -10px;
}
</style>
</head>
<body>
<div id="father">
<a href="top"></a>
<div id="d1">
<ol>
<li> <a href="#">博客 </a> </li>
<li> <a href="#">课程 </a> </li>
<li> <a href="#">文库商城 </a> </li>
<li> <a href="#">问答 </a> </li>
<li> <a href="#">社区 </a> </li>
<li> <a href="#">插件 </a> </li>
<li> <a href="#">认证 </a> </li>
<li> <a href="#">开源 </a> </li>
</ol>
</div>
<div id="d2">
<div id="g">
<p id="w">~小安同学</p>
</div>
</div>
<div id="d3">3333333</div>
<div id="d4">4444444</div>
<div id="d5">
<ol>
<li> <a href="#">博客(13) </a> </li>
<li> <a href="#">资源(0) </a> </li>
<li> <a href="#">论坛(0) </a> </li>
<li> <a href="#">问答(0) </a> </li>
<li> <a href="#">收藏 </a> </li>
<li> <a href="#">关注 </a> </li>
</ol>
</div>
<div id="d6">6666666</div>
<div id="d7"><a href="#top">返回顶部</a></div>
</div>
</body>
</html>