百度首页

div.a{
    width: 700px;
    height: 200px;
    /* border: 3px  red solid; */
    margin: auto;
    text-align: center;
}
h1.a{
    text-align: center;
}
li.a{
    display: inline;
}
a.a{
    text-decoration: none;
    font-weight: 700;
    color: rgb(2, 2, 2);

}
div.b{
    width: 700px;
    height: 180px;
    /* border: 3px red solid; */
    margin: auto;
    text-align: center;
}
input{
    width: 500px;
    height:50px;
    border: 3px rgba(39, 53, 61, ) ridge; 
    position: relative;
    right:-20px;
    border-radius: 5px;
}
button{
    width: 100px;
    height: 45px;
    border-radius: 8px;
    position: relative;
    right: -30px;
}
li.b{
    display: inline;
}
div.c{
    width: 400px;
    /* border: 3px red solid; */
    margin: auto;
    text-align: center;
}
div.d{
    width: 400px;
    height: 30ox;
    margin: auto;
    /* border: 3px solid red; */
    text-align: center;
}
div.e{
    margin: auto;
    text-align: center;
}
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
    <link rel="stylesheet" href="./css/百度首页.css">
</head>
<body>
    <div class="a">
        <h1 class="a"><img src="./img/logo.gif" ></h1>
        <ul>
            <li class="a"><a href="#" >新 闻</a></li>
            <li class="a"><a href="#" class="a">网 页</a></li>
            <li class="a"><a href="#">贴 吧</a></li>
            <li class="a"><a href="#">知 道</a></li>
            <li class="a"><a href="#">音 乐</a></li>
            <li class="a"><a href="#">图 片</a></li>
            <li class="a"><a href="#">视 频</a></li>
            <li class="a"><a href="#">地 图</a></li>
        </ul>
</div>
<br>
    <div class="b">
        <input type="text" >
        <button>百度一下</button>
        <ul>
            <li class="b"> <a href="#" >百科</a></li>
            <liclass="b"> <a href="#">文库</a></li>
            <liclass="b"> <a href="#">hao123</a></li>
            <liclass="b"> <a href="#">|</a></li>
            <liclass="b"> <a href="#">更多</a>>></li>
        </ul>
        <br>
        <img src="./img/icon.jpg" >
    <a href="#" class="b">百度地图带你吃喝玩乐,全心全意为人民服务</a>
    </div>
    <br>
    <div class="c">
       <a href="#" >把百度设置为主页 安装百度卫士 </a>
    </div>
        <div class="d">
        <a href="">加入百度推广|搜索风云榜|关于百度|about baidu</a>
    </div>
    <div class="e">
    <p>©2021 Baidu 使用百度前必读 京ICP证030178号</p>
</div>
</body>
</html>
1f41858b96e43c53492b43e577336320.png
© 版权声明
THE END
喜欢就支持一下吧
点赞6赞赏 分享
评论 抢沙发

请登录后发表评论