百度首页模仿
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>百度首页练习</title>
<style>
body {
font-size: 14px;
color: #666;
}
div {
text-align: center;
}
.header {
height: 220px;
text-align: center;
}
.cotent {
height: 220px;
text-align: center;
}
.footer {
height: 200px;
text-align: center;
}
.logo {
height: 150px;
}
input[type=text] {
width: 400px;
height: 30px;
}
input[type=submit] {
width: 100px;
height: 30px;
}
.search {
height: 70px;
}
.bk {
height: 100px;
}
.aq {
height: 40px;
}
.tg {
height: 40px;
}
</style>
</head>
<body>
<div class="header">
<div><img src="images/bdlogo.gif" alt="图片走丢了" class="logo"></div>
<div class="nav">
<a href="#">新闻</a>
<strong>网页</strong>
<a href="#">贴吧</a>
<a href="#">知道</a>
<a href="#">音乐</a>
<a href="#">图片</a>
<a href="#">音乐</a>
<a href="#">视频</a>
<a href="#">地图</a>
</div>
</div>
<div class="cotent">
<div class="search">
<form action="">
<input type="text" name="" id="">
<input type="submit" value="百度一下">
</form>
</div>
<div class="bk">
<a href="#">百科</a>
<a href="#">文库</a>
<a href="#">hao123</a>
|
<a href="#">更多>></a>
</div>
<div>
<img src="images/ic.jpg" alt="图片走丢了">
<a href="#">百度地图带你吃喝玩乐,全心全意为人民服务</a>
</div>
</div>
<div class="footer">
<div class="aq">
<a href="#">把百度设置为主页</a>
<a href="#">安装百度卫士</a>
</div>
<div class="tg">
<a href="#">加入百度推广</a>
|
<a href="#">搜索风云榜</a>
|
<a href="#">关于百度</a>
|
<a href="#">About BaiDui</a>
</div>
<div>
©2016 Baidu 使用百度前必读 京ICP证666号
</div>
</div>
</body>
</html>