由HTML和CSS写的Google页面

最新推荐文章于 2021-06-04 06:48:01 发布

weixin_34122810

最新推荐文章于 2021-06-04 06:48:01 发布

阅读量887

点赞数

文章标签： python

原文链接：https://my.oschina.net/u/1403159/blog/184036

版权

2019独角兽企业重金招聘Python工程师标准>>>

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta http-equiv="content" content="text/html" charset="utf-8"/>
    <style type="text/css">
        *{
            margin: 0;
            padding: 0;
        }
        .main{
            width: 100%;
            height: 32px;
            text-decoration: none;
            font-size: 13px;
            line-height: 30px;
            background-color: #2D2D2D;
        }
        .main a{
               text-decoration: none;
            color: #fff;
        }
        .main1{
            text-decoration: none;
           float:right;
             clear: right;
        }
        .main ul li{
            color: #fff;
            font-family: 微软雅黑;
            list-style-type: none;
            margin-left: 10px;
            float: left;
        }
         .top{
             width: 100%;
             height: 45px;
             font-size: 13px;
             line-height: 40px;
             background-color: #F2F2F2;
             margin-top: 52px;
         }
         .top a{
             text-decoration: none;
         }
         .toptwo{
             float:right;
             clear: right;
         }
        .body{
            width: 600px;
            height: 300px;
            margin-left: 350px;
           margin-top: 250px;
            text-align: center;
        }
        .sousuo input{
                width: 450px;
            height: 20px;
        }
        .submit input{
            width: 80px;
            height: 30px;
            background-color: #F3F3F3;
            border: none;
             margin-top: 20px;
            opacity: 0.6;
        }
        .bodytop{
            font-size: 10px;
            margin-top: 40px;
        }
          .bodytop a{
              font-size: 10px;
          }
        .submit input:hover{
            opacity: 1;
        }
        .top a:hover{
           text-decoration: underline;
        }
        .main ul li:hover{
            background-color: #6d6d6d;
        }
    </style>
</head>
<body>
<div class="main">
    <ul>
        <li><a href="">+你</a></li>
        <li><a href="">搜索</a></li>
        <li><a href="">地图</a></li>
        <li><a href="">图片</a></li>
        <li><a href="">Play</a></li>
        <li><a href="">You Tube</a></li>
        <li><a href="">新闻</a></li>
        <li><a href="">Gmeil</a></li>
        <li><a href="">更多</a></li>
    <div class="main1"><a href="#">登陆</a> </div>
    </ul>
</div>
    <div class="body">
   <div class="body1">
       <img src="logo11w.png" width="300" height="150" />
       <label>谷歌</label>
   </div>
<div class="sousuo">
    <input type="text" value="搜索"/>
</div>
<div class="submit">
    <input type="submit" value="Google搜索"/>
    <input type="button" value="手气不错"/>
</div>
        <div class="bodytop">
            <label>Google.com.hk 使用下列语言：</label>
            <a href="">中文(繁體)</a>
            <a href="">English</a>
        </div>
</div>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<div class="top">
    <a href=""> 广告</a>
    <a href=""> 商务</a>
    <a href=""> Google大全</a>
    <div class="toptwo">
        <a href="">新的隐私权政策和条款 </a>
        <a href=""> 设置</a>
        <a href=""> Google.comn </a>
    </div>
</div>
</body>
</html>

转载于:https://my.oschina.net/u/1403159/blog/184036