仿百度搜索主页源码

最新推荐文章于 2024-05-04 18:59:02 发布

防脱发的小萌新

最新推荐文章于 2024-05-04 18:59:02 发布

阅读量2.9k

点赞数 1

本文链接：https://blog.csdn.net/weixin_42303820/article/details/100576742

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>百度一下，你就知道</title>
<style>
    #biao{
        text-align: right;
    }
    /*上面的文字*/
    #biao > a{
        margin-left: 1%;
        color: black;
        font-size: 12px;
    }
    #biao1{
        text-align: center;
        margin-top: 30px;
        margin: 3%;
    }
    /*百度推广*/
    #biao1>a{
    color: #999;
        font-size: 12px;
    }
    /*搜索框*/
    #biao2{
        width: 619px;
        height: 30px;
        margin-top: 19px;
        margin-left: 30%;
        border: 1px solid cornflowerblue;
    }
    /*百度图标*/
    #tubiao{
        padding-top: 4%;
        text-align: center;
    }
    #tubiao > img{
        width: 250px;
    }
    /*百度按钮*/
    #baidu{
        width: 105px;
        height: 27px;
        border: 1px solid cornflowerblue;
        text-align: center;
        margin: auto;
        padding-top: 2px;
        float: right;
        background: #3385ff;

    }
    /*更多产品*/
    #gengduocp{
        width: 50px;
        height: 20px;
        border: 1px solid cornflowerblue;
        text-align: center;
        margin: auto;
        padding-top: 2px;
        float: right;
        text-decoration: none;
        background: #3385ff;
    }
    #baidu > a{
        text-decoration: none;
        color: #ffffff  ;
    }
    #erweima{
        margin-top: 10%;
        text-align: center;
    }
    #erweima > img {
        width: 100px;
    }
    /*最后一个*/
    #shiyon{
        text-align: center;
        color: #999999;
        font-size: 12px;
    }
    #biao3{
        float:left;
    }
    #biao3 > img{
        margin-left:2700% ;
        margin-top: 8px ;
    }
</style>
</head>
<body>
<!--上面的字-->
<div id="biao">
    <a href="">新闻</a>
    <a href="">hao123</a>
    <a href="">地图</a>
    <a href="">视频</a>
    <a href="">贴吧</a>
    <a href="">学术</a>
    <a href="">登入</a>
    <a href="" id="gengduocp"style="color: white">更多产品</a>
</div>
<!--图标-->
<div id="tubiao">
    <img src="//www.baidu.com/img/bd_logo1.png?qua=high" alt="">
</div>
<!--搜索框-->
<div>
<div id="biao2">
    <div id="biao3">
        <img src="./camera_new_5606e8f.png" alt="">
    </div>
<div id="baidu">
    <a href="">百度一下</a>
</div>
</div>
</div>
<!--二维码-->
<div id="erweima">
    <img src="https://ss1.bdstatic.com/5eN1bjq8AAUYm2zgoY3K/r/www/cache/static/protocol/https/home/img/qrcode/zbios_09b6296.png" alt="">
    <p>下载百度APP</p>
    <p style="color: #999;font-size: 12px">有事搜一搜  没事看一看</p>
</div>
<!--推广那里-->
<div id="biao1">
    <a href="">把百度设为主页</a>
    <a href="">关于百度</a>
    <a href="">About  Baidu</a>
    <a href="">百度推广</a>
</div>
<!--使用必读那里-->
<div id="shiyon">
<span>©2019 Baidu</span>
    <a href="" style="color: #999999;"> 使用百度前必读</a>
    <a href=""style="color: #999999;"> 意见反馈</a>
    <span>京ICP证030173号  </span>
    <a href=""style="color: #999999;">京公网安备11000002000001号</a>
</div>
</body>
</html>

防脱发的小萌新

关注

1
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
仿百度搜索主页源码

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>百度一下，你就知道</title><style> #biao{ text-align: right; } /*上面的文...
复制链接

扫一扫