H5写一个百度搜索页面源代码

来源：互联网发布：英文域名转码编辑：程序博客网时间：2024/04/27 18:41

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
.top{
width:100%;
height:64px;}
.top>.title{
height:64px;
float:right;}
.top>.title>span{
line-height:64px;
float:right;}
.top>.title>span>a{
font-size:13px;
font-family:"宋体";
text-decoration:underline;
color:#333}
.top>.title>span>.bold{
font-weight:bold;}
.list{
border:0;
height:25px;
width:60px;
background:#36F;
color:#fff;}
.pic{
text-align:center;
margin-bottom:30px;}
.logo{
height:130px;
width:270px;}
.search{
text-align:center;}
.input{
width:540px;
height:36px;}
.btn{
border:0;
width:100px;
height:40px;
background:#36F;
font-size:15px;
color:#fff;}
.foot{width:100%;
position:absolute;
bottom:100px;}
.foot>.link{
text-align:center;
margin-bottom:10px;}
.foot>.link>a{
font-size:12px;
font-family:"宋体";
text-decoration:underline;}
.copyright{
text-align:center;}
p,p>a{
font-size:12px;
font-family:"宋体";
color:#666;}

</style>
</head>
<body>
<div class="top">
<div class="title">
<span>
<a class="bold" href="#">新闻</a> 
<a class="bold" href="#">hao123</a> 
<a class="bold" href="#">地图</a> 
<a class="bold" href="#">视频</a> 
<a class="bold" href="#">贴吧</a> 
<a href="#">登陆</a> 
<a href="#">设置</a> 
<input class="list" type="submit" value="更多产品" name="submit" /> 
</span>
</div>
</div>
<div class="body">
<div class="pic">
<img class="logo" src="img/14.jpg" />
</div>
<div class="search">
<form>
<label for="search"></label>
<input class="input" type="text" name="search" id="search" value="" /><input class="btn" type="submit" value="百度一下" name="submit" />
</form>
</div>
</div>
<div class="foot">
<div class="link">
<a href="#">把百度设为主页</a> 
<a href="#">关于百度</a> 
<a href="#">About Baidu</a>
</div>
<div class="copyright">
<p>
©2015 Baidu <a href="#">使用百度前必读</a> <a href="#">意见反馈</a> 京ICP证030173号
</p>
</div>
</div>

</body>
</html>

阅读全文

0 0

H5写一个百度搜索页面 源代码

H5写一个百度搜索页面源代码