首页 > 其他分享 >百度首页

百度首页

时间：2022-10-07 22:44:20浏览次数：73  
标签：font height width 首页 position 0px display 百度

``` <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> <link rel="stylesheet" href="/baidu.css"> <style> * { text-decoration: none; } 

    a {
        color: black;
    }

    .top-left {
        padding-left: 24px;
        text-align: left;
    }

    a:hover {
        color: #4e6ef2;
    }

    .info {
        font: 13px Arial, sans-serif;
        margin: 19px 24px 0px 0px;
        display: inline-block;
    }

    .right {
        position: absolute;
        right: 0px;
        width: 150px;
    }

    .drop {
        text-align: center;
        position: relative;
        display: inline-block;
        padding-right: 23px;
    }

    .blank {
        /* display:block; */
        font: 13px Arial, sans-serif;
    }

    .setting {
        position: relative;
        display: inline-block;
        width: 26px;
        height: 23px;
        margin: 19px 0px 0px 24px;
        font: 13px Arial, sans-serif;
    }

    .drop-content {
        border-radius: 6px 6px 6px 6px;
        list-style: none;
        position: absolute;
        display: none;
        position: absolute;
        background-color: #f9f9f9;
        min-width: 61px;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        padding: 12px 16px;
        line-height: 25px;
        z-index: 10px;
    }

    .drop:hover .drop-content {
        display: block;
    }

    .login {
        position: absolute;
        top: -3px;
        left: 50px;
        background: #4e6ef2;
        display: inline-block;
        margin: 18px 0px 0px 32px;
        color: #ffffff;
        border: 0;
        height: 24px;
        line-height: 24px;
        width: 48px;
        border-radius: 6px;
    }

    .main {
        width: 650px;
        height: 0px;
        margin: 150px auto 100px;
        position: relative;
    }

    .logo {
        position: absolute;
        top: 140px;
        left: 180px;
    }

    .pho {
        position: absolute;
        top: -300px;

    }

    .pho>img {
        width: 270px;
        height: 129px;
    }

    .sou {
        box-sizing: border-box;
        width: 550px;
        height: 44px;
        padding: 12px 87px 12px 16px;
        margin: 0;
        border-radius: 10px 0 0 10px;
        border: solid rgb(196, 199, 206);

    }

    .sou:focus {
        border-color: lightblue;
    }

    .but {
        position: absolute;
        background-color: #4e6ef2;
        padding: 0;
        width: 108px;
        height: 44px;
        line-height: 45px;
        border-radius: 0 10px 10px 0;
        color: #fff;
        font-weight: 400;
        font-weight: 17px;
        border: none;
    }

    .footer {
        text-align: center;
        padding-left: 210px;
        position: fixed;
        bottom: 0;
        margin: 0px auto;
        height: 40px;
        line-height: 40px;
        font-size: 10px;
    }

    .finfo {
        display: inline-block;
        color: #bbbbbb;
        height: 13.33px;
        font: 12px Arial, sans-serif;
        margin: 0px 14px 0px 0px;
    }

    .hotnews {
        top: 40px;
        position: relative;
    }

    .f1 {
        font: 14px;
        width: 72.99px;
        height: 24.67px;
    }

    .iii {
        position: relative;
        top: 10px;
        display: inline-block;
        width: 306px;
        line-height: 36px;
        height: 36px;
        color: #626675;
        font: 16px Arial, sans-serif;

    }

    .jjj {

        position: absolute;
        top: 29px;
        right: 0px;
        display: block;
        width: 306px;
        line-height: 36px;
        height: 36px;
        color: #626675;
        font: 16px Arial, sans-serif;

    }

    .hhhh {
        position: absolute;
        z-index: 22;
        width: 40px;
        height: 25px;
        left: 506px;
        top: 12px;
    }

    .more {
        display: none;
        z-index: 22;
        border-radius: 6px 6px 6px 6px;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    }

    .p:hover.more {
        display: absolute;
    }
</style>
</head> 新闻 hao123 地图 贴吧 视频 图片 网盘 更多 设置 搜索设置 高级设置 关闭预测 隐私设置 关闭热榜 
<div class="main">
    <div class="logo">
        <a class="pho"
            href="https://www.baidu.com/s?wd=%E5%9B%BD%E5%BA%86%E8%8A%82&sa=ire_dl_gh_logo_texing&rsv_dl=igh_logo_pc"><img
                src="https://s3.bmp.ovh/imgs/2022/09/28/38134a72e9919ad2.png"></a>
    </div>
    <span>
        <input placeholder="百度一下" type="text" class="sou">
        <img src="https://s3.bmp.ovh/imgs/2022/10/07/a0c2fbf17982e927.png" class="hhhh">
    </span>
    <button class="but">百度一下</button>
    <div class="hotnews">
        <div class="f1">
            <a href="https://top.baidu.com/board?platform=pc&sa=pcindex_entry"><strong>百度热搜</strong></a>
            <a class="iii"
                href="https://www.baidu.com/s?wd=%E5%9D%9A%E5%AE%88%E5%9C%A8%E5%B2%97%E4%BD%8D+%E5%96%9C%E8%BF%8E%E4%BA%8C%E5%8D%81%E5%A4%A7&sa=fyb_n_homepage&rsv_dl=fyb_n_homepage&from=super&cl=3&tn=baidutop10&fr=top1000&rsv_idx=2&hisfilter=1"><span
                    style="color:red; margin-right:8px;">1</span>坚守在岗位
                喜迎二十大</a>
            <a class="jjj"
                href="https://www.baidu.com/s?wd=%E4%B8%B0%E6%94%B6%E6%99%92%E7%A7%8B%E7%BE%8E%E5%A6%82%E7%94%BB&sa=fyb_n_homepage&rsv_dl=fyb_n_homepage&from=super&cl=3&tn=baidutop10&fr=top1000&rsv_idx=2&hisfilter=1"><span
                    style="margin-right:8px; color:#faa90e">4</span>丰收晒秋美如画</a>
            <a class="iii"
                href="https://www.baidu.com/s?wd=%E7%94%B7%E5%AD%90%E5%9B%9E%E5%BA%94%E2%80%9C%E4%B8%8D%E7%94%A8%E6%B4%97%E5%8F%91%E6%B0%B4%E5%8F%98%E6%BB%A1%E5%A4%B4%E9%BB%91%E5%8F%91%E2%80%9D&sa=fyb_n_homepage&rsv_dl=fyb_n_homepage&from=super&cl=3&tn=baidutop10&fr=top1000&rsv_idx=2&hisfilter=1"><span
                    style="color:#fe2d46; margin-right:8px;">2</span>男子回应“不用洗发水变满头黑发”</a>
            <a class="jjj" style="top:66px;"
                href="https://www.baidu.com/s?wd=%E5%91%98%E5%B7%A5%E5%BD%93%E9%A1%BE%E5%AE%A2%E9%9D%A2%E6%8A%8A%E6%89%AB%E5%9C%B0%E5%9E%83%E5%9C%BE%E5%80%92%E8%BF%9B%E9%A4%90%E7%9B%98&sa=fyb_n_homepage&rsv_dl=fyb_n_homepage&from=super&cl=3&tn=baidutop10&fr=top1000&rsv_idx=2&hisfilter=1"><span
                    style="margin-right:8px; color:#9195a3;">5</span>员工当顾客面把扫地垃圾倒进餐盘</a>
            <a class="iii"
                href="https://www.baidu.com/s?wd=%E9%80%81%E5%AD%90%E4%B8%8A%E5%8C%97%E5%A4%A7%E7%9A%84%E7%88%B8%E7%88%B8%E5%88%B0%E5%8C%97%E5%A4%A7%E5%81%9A%E9%B8%A1%E8%9B%8B%E7%81%8C%E9%A5%BC&sa=fyb_n_homepage&rsv_dl=fyb_n_homepage&from=super&cl=3&tn=baidutop10&fr=top1000&rsv_idx=2&hisfilter=1"><span
                    style="color:#ff6600;margin-right:8px;">3</span>送子上北大的爸爸到北大做鸡蛋灌饼</a>
            <a class="jjj" style="top:101px"
                href="https://www.baidu.com/s?wd=%E5%8D%8E%E8%A5%BF%E6%95%99%E6%8E%88%E5%9B%9E%E5%BA%94%E5%9B%9E%E5%AE%B6%E8%BF%87%E8%8A%82%E5%B8%AE%E4%B9%A1%E4%BA%B2%E7%9C%8B%E7%97%85&sa=fyb_n_homepage&rsv_dl=fyb_n_homepage&from=super&cl=3&tn=baidutop10&fr=top1000&rsv_idx=2&hisfilter=1"><span
                    style="color:#9195a3;margin-right:8px;">6</span>华西教授回应回家过节帮乡亲看病</a>
        </div>
    </div>
</div>
<div class="footer">
    <a class="finfo" style="width:48px;">关于百度</a>
    <a class="finfo" style="width:65.39px;">About Baidu</du>

        <a class="finfo" style="width:84px;">使用百度前必读</a>

        <a class="finfo" style="width:48px;">帮助中心</a>

        <a class="finfo" style="width:48px;">企业推广</a>

        <a class="finfo" style="width:164.55px;">京公网安备11000002000001号</a>
        <a class="finfo" style="width:96.05px;">京ICP证030173号</a>
        <a class="finfo" style="width:205.17px">信息网络传播视听节目许可证 0110516</a>
        <a class="finfo" style="width:289.42px;">互联网宗教信息服务许可证编号:京（2022）0000043</a>

</div>
</body> ```

标签：font,height,width,首页,position,0px,display,百度
From： https://www.cnblogs.com/Flying-bullet/p/16767403.html

相关文章

赞助商

阅读排行

网站主页关于我们联系我们网站地图

本网站内容转载自其他媒体，侵权联系[admin##ips99.com]。

Copyright © 2020-2023 IPS99 版权所有 IPS99