<!DOCTYPEhtml>
<html lang="ch_CN">
<head>
<meta charset="UTF-8">
<title>百度首页</title>
<style type="text/css">
.top {
width: 45%;
height: 64px;
}
.top>.title {
height: 64px;
float: center;
}
.top>.title>span {
line-height: 10px;
}
.top>.title>span>a {
color: black;
font-size: 15px;
font-family: "宋体";
text-decoration: none;
}
.top>.title>span>.body {
font-weight: bold;
}
.body>.picture {
text-align: center;
margin-top: 10px;
}
.body>.search {
text-align: center;
}
.body>.search>.abc>.input {
width: 540px;
height: 36px;
margin-top: 0px;
}
.body>.search>.abc>.btn {
text-align: center;
width: 100px;
height: 40px;
margin-top: 10px;
background: blue;
color: white;
font-size: 13px;
}
.foot {
width: 100%;
position: absolute;
bottom: 0px;
}
.foot>.link {
text-align: center;
margin-bottom: 0px;
}
.foot>.link>a {
font-size: 15px;
font-family: "宋体";
text-decoration: none;
}
.foot>.footer {
text-align: center;
font-size: 15px;
font-family: "宋体";
}
.font>.footer>a {
text-decoration: none;
color: blue;
}
#yjbk {
border: 2px solid blue;
padding: 5px 15px;
background: beige;
width: 10px;
border-radius: 15px;
}
</style>
</head>
<body>
<div class="top">
<div class="title">
<span>
<a class="body" href="https://www.baidu.com" >新闻</a>
<a class="body" href="https://www.baidu.com">hao123</a>
<a class="body" href="https://www.baidu.com">地图</a>
<a class="body" href="https://www.baidu.com">直播</a>
<a class="body" href="https://www.baidu.com">视频</a>
<a class="body" href="https://www.baidu.com">贴吧</a>
<a class="body" href="https://www.baidu.com">学术</a>
<a href="https://www.baidu.com">更多</a>
<a>设置</a>
<a id="yjbk" >登录</a>
</span>
</div>
</div>
<div class="body">
<div class="picture">
<image src="C:\Users\86166\Desktop\前端基础案例\2\baidu.jpg.jpg" "widht="540 " height="258 " />
</div>
<div class="search ">
<from class="abc " action="https://www.baidu.com/?tn=21002492_16_hao_pg ">
<label for="search "></label>
<input class="input " type="text " name="search " id="search " value=" " />
<input class="btn " type="submit " value=" 百度一下 " name="submit " />
</from>
<div class="foot ">
<div class="link ">
<a href=" ">关于百度</a>
<a href=" ">About Baidu</a>
<a href=" ">使用百度前必读</a>
<a href=" ">帮助中心</a>
<a href=" ">京公网安备11000002000001号</a>
<a href=" ">把百度设为主页</a>
<a href=" ">意见反馈</a>
<a href=" ">京ICP证030173号</a>
<a href=" ">@2022baidu</a>
</div>
</div>
</body>
</html>