个人网站导航

Original 2019-05-28 18:41:25 441
abstract:<!DOCTYPE html><html><head>    <meta charset="utf-8">    <title>个人网站</title>    <style>        /*h


<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8">
   <title>个人网站</title>
   <style>
       /*header begin*/
       .header {
           /*参考色块*/
           background-color:black;

       }

       .header .content {
           width: 1000px;
           height:60px;
           /*参考色块*/
           background-color:black;
           margin:0 auto;



       }

       /*头部内容区中的导航*/
       .header .content .nav {
           margin-top:0;
           margin-bottom: 0;
           padding-left:0;

       }

       .header .content .nav .item {
           list-style-type: none;

       }

       /*头部导航中的链接样式:重点*/
       .header .content .nav .item a {
           float: left;
           min-width: 80px;
           min-height:60px;
           line-height:60px;
           color:white;
           text-decoration-line:none;
           padding:0 15px;
           text-align:center;

       }

       .header .content .nav .item a:hover {
           color:white;
           font-size: 1.1rem;

       }
       /*header end*/


       /*虚拟的主体部分*/
       .container {
           width:1000px;
           height:800px;
           margin:5px auto;
           background-color: lightgray;
       }


       /*footer begin*/
       .footer {
           background-color: lightgrey;
       }

       .footer .content {
           width:1000px;
           height:60px;
           background-color:#444;
           margin:0 auto;

       }

       .footer .content p {
           text-align:center;
           line-height:60px;
       }

       .footer .content a {
           text-decoration:none;
           color:lightgrey;
       }

       .footer .content a:hover {
           color: white;

       }
   </style>
</head>
<body>
<!-- 头部 -->
<div class="header">
   <div class="content" >
       <ul class="nav" >
           <li class="item"><a href="">我的主页</a></li>
           <li class="item"><a href="">个人简介</a></li>
           <li class="item"><a href="">网站首页</a></li>
           <li class="item"><a href="">设计论坛</a></li>
           <li class="item"><a href="">联系我们</a></li>
       </ul>
   </div>
</div>
</body>
</html>

Correcting teacher:查无此人Correction time:2019-05-29 13:14:58
Teacher's summary:完成的不错。刚接触编程,理解起来比较辛苦。要坚持,继续加油。

Release Notes

Popular Entries