HTML连载31-制作一个百度首页
程序员文章站
2022-10-04 14:15:22
一、 我们制作一个百度首页作为练习，可直接复制该代码保存后缀名为.html来查看 二、源码： d93_baidu_home_exercise.html 地址: https://github.com/ruigege66/HTML_learning/blob/master/d93_baidu_home_ ......
一、 我们制作一个百度首页作为练习，可直接复制该代码保存后缀名为.html来查看
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>d93_baidu_home_exercise</title>
<style>
.header{
height: 250px;
/*background-color: red;*/
}
.content{
height: 220px;
/*background-color: pink;*/
}
.footer{
height: 200px;
/*background-color:green;*/
}
div{
text-align: center;
}
.logo{
background-color:skyblue;
height: 130px;
}
input[type=text]{
width: 400px;
height:30px;
}
input[type=submit]{
width:80px;
height:30px;
}
.content_form{
height:80px;
}
body{
font-size: 16px;
}
</style>
</head>
<body>
<div class="header">
<div>
<img src="image/baidu_logo.png" alt="" class="logo">
</div>
<div class="header_navgitor">
<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="content">
<div class="content_form">
<form action="http://www.baidu.com">
<input type="text" name="" id="">
<input type="submit" value="百度一下" >
</form>
</div>
<div>
<a href="#">百科</a>
<a href="#">文库</a>
<a href="#">hao123</a>
<a href="#">更多>></a>
</div>
</div>
<div class="footer">
<div>
<a href="#">把百度设为首页</a>
<a href="#">安装百度卫士</a>
</div>
<div>
<a href="#">加入百度推广</a>
｜
<a href="#">关于百度</a>
｜
<a href="#">about 百度</a>
</div>
<div>
@2019baidu，使用百度前必读 京icp证666号
</div>
</div>
</body>
</html>
二、源码：
d93_baidu_home_exercise.html
地址:
https://github.com/ruigege66/html_learning/blob/master/d93_baidu_home_exercise.html
2.csdn：https://blog.csdn.net/weixin_44630050（心悦君兮君不知-睿）
3.博客园：https://www.cnblogs.com/ruigege0000/
4.欢迎关注微信公众号：傅里叶变换，后台回复“礼包”获取java大数据学习视频礼