css+html實現類比百度首頁(附代碼)

來源:互聯網
上載者:User

本篇文章給大家帶來的內容是關於css+html實現類比百度首頁(附代碼),有一定的參考價值,有需要的朋友可以參考一下,希望對你有所協助。

代碼如下:

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <style>        #biaoqian{               float: right;                           margin: 10px;                       }        #d2,#d3,#d4,#d5,#d6,#d7,#d8,#d9{                    margin: 5px;                    }        #title{                    padding-left: 200px;                 }        .inputw{                   height: 32px;                      line-height: 30px;                  }        #pic{                     margin-top: 180px;                      padding-left: 380px;                  }        #and{                    margin: 30px;                     margin-top: 30px;                 }        #a1 {                    padding-left:340px ;                    margin-top: 40px;                 }        #erweima{                    margin-top: 200px;                     padding-left: 500px;                 }    </style>    </head>    <body>    <div id="biaoqian">    <a href="2.mp4" id="d2">新聞</a>    <a href="2.mp4" id="d3">hao123</a>    <a href="2.mp4" id="d4">地圖</a>    <a href="2.mp4" id="d5">視頻</a>    <a href="2.mp4" id="d6">貼吧</a>    <a href="2.mp4" id="d7">學術</a>    <a href="2.mp4" id="d8">登入</a>    <a href="2.mp4" id="d9">設定</a>    </div>    <div id="and">    <img src="timg_看圖王.jpg" id="pic" width="250"height="108">    <form>    <div id="title">    <input class="inputw" name="aa" type="text" size="70" >    <input class="inputw" type="button" name="aa" onclick="helloword" value="百度一下"><br>    </div>    </form>    </div>    <div id="erweima">    <img src="百度二維碼.png">    </div>    <div id="a1">    <a href="2.mp4">把百度設為首頁</a>    <a href="2.mp4">關於百度</a>    <a href="2.mp4">ABOUT BAIDU</a>    <a href="2.mp4">百度推廣</a>    </div>    </body>    </html>

運行結果:

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.