我的练习导航页

怪默

身体和灵魂总有一个要在路上

我的练习导航页

web 练习

发布日期: 2020-10-15

作者: 怪默

文章字数: 407

阅读时长: 2 分

阅读次数:

```


<!DOCTYPE html>
<html><head>
<link  rel="icon" href="https://ftp.bmp.ovh/imgs/2020/10/483dbbb1bf1022f1.png" type="image/x-icon"/>
<title>link to</title>
    <style>
        body{

            top: 0;left: 0;
            width:100%;height:100%;
            z-index:-10;
            background: url( "https://ftp.bmp.ovh/imgs/2020/10/f85ea1f626f7980b.jpg");
            background-repeat: no-repeat;
            background-size: cover;
            }
        .poem{
            float: left;
              margin-top: 100px;
             width: 40%;
              color:azure;
            }
        .content{
            float:left;
            margin-top: 120px;
            background:hsla(21,12%,62%,0.7);
            width: 50%;
            height: 50%;
            color: azure;
        }
        .center{
            margin-left: 50px;
            margin-top: 30px;
              text-align: center;
            }
        .contentTitle{
            padding-left: 30px;
        }
        a{
            color: white;
        }
        a:hover{
            color: aqua;
        }
        ol{
            padding-left: 70px;
        }
        .footer{
            float: left;
            width: 100%;
            margin-top: 120px;
            font-size:13px;
            color: aliceblue;
       }
        .footerText{
            position:fixed;
            bottom:5px;
            left:500px;

        }
        html{
            overflow-x: hidden;
            overflow-y:hidden;
        }
    </style>
</head>
<body>
    <div class="poem">
          <p class="center">草在结它的种子，</p>
          <p class="center">风在摇它的叶子，</p>
          <p class="center">我们站着，</p>
          <p class="center">不说话，</p>
          <p class="center">就十分美好。</p>
      </div>
    <div class="content">
        <div>
            <p class="contentTitle">我的练习：</p>
            <ol>
                <li><a href="messageCollect.html" target="_blank">个人信息收集表</a></li>
                <li><a href="bing.html" target="_blank">仿bing</a></li>
                <li><a href="blogHome" target="_blank">个人博客首页</a></li>
            </ol>
            </div></div>
    <div class="footer">
           <p class="footerText">Copyright &copy; 2020 &nbsp;怪默&nbsp; 版权所有</p>
      </div>  
</body>
</html>

```