html制作百度首页 day03

html代码

仿百度页面
</div>

<div class="middle">
    <div class="middle-for">
        <div class="middle-pic"><img src="timg.jpg" alt=""></div>
        <div class="middle-secs">
            <div class="middle-txt" >
            </div>
            <div class="middle-btn" >百度一下</div>
        </div>
        <br><br>
        <div class="middle-pic"><img src="pic01.jpg" alt=""></div>
        <div style="margin: auto;text-align: center" >
        <a style="font-weight: bold">下载百度APP</a></br>
        <a style="color: gray;">有事搜一搜 没事看一看</a>
        </div>
    </div>
</div>

把百度设置为主页关于百度百度

@2019 Baidu 使用百度前必读 意见反馈 京ICP证03073号

css代码

html,body{height: 100%;}
.head{margin:auto;width: 100%;
height: 32px;border-bottom: 1px solid #ebebeb;text-align: right;}
.head ul{display: inline-block;}
.head ul li{float: left;margin: 0 10px;}
.head ul li a{color:black;font-size: 14px;line-height: 32px;text-decoration:underline;}
.head ul li a:hover{color:blue;}
.middle{padding-top: 10%;}
.middle-for{width: 640px;margin: 0px auto;}
.middle-pic{text-align:center;}
.middle-pic img{width: 100px;margin: 0px auto;}
.middle-secs{border: 1px solid dodgerblue;height: 30px;width :528px;margin: 0 auto}
.middle-txt{width: 528px;}
.middle-btn{height:30px;width:75px;color: white;background-color: dodgerblue;
margin-left:auto;text-align: center;line-height: 30px}
.middle-btn1{height: 20px;width :75px;color :white;background-color: dodgerblue;
text-align: center;float: left;margin: 0 10px;}
.foot{bottom: 10px;width: 100%;text-align: center;}
.foot p{color: #999;font-size: 14px;line-height:32px ;}
.foot p a{margin: 0 10px;color: #999;text-decoration: underline;}

发布了7 篇原创文章 · 获赞 0 · 访问量 119
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览