摘要：<!DOCTYPE html><html><head> <meat charset="uft-8"> <link rel="stylesheet" type="text/css" href="css/index.css"> <title>百度搜索框
<!DOCTYPE html>
<html>
<head>
<meat charset="uft-8">
<link rel="stylesheet" type="text/css" href="css/index.css">
<title>百度搜索框制作-小結(jié)</title>
<style type="text/css">
*{padding: 0px;margin: 0px;font-family: arial, 'Microsoft Yahei', '微軟雅黑'}
.top{height: 32px;width: 100%;border-bottom: 1px solid #ccc;}
.top span{height: 32px;width: 210px; line-height: 32px;padding-left: 15px;font-size: 12px;color: #555555;}
.top em{font-style: normal;font-size: 12px;color: #555555;padding-left: 4px;}
em a{color:#555555 }
.top_right{height: 32px;width: 590px;float: right;}
.top_right span em{font-size: 14px;color: #555555;font-weight: bold;padding-left: 24px;}
.boximg{position: relative;text-align: center;margin-top:20px; }
.boximg img{width: 270px;height: 129px;}
.s_form{position: relative;text-align: center;margin-top:10px;}
.s_form input{width: 555px;height: 41px;}
.s_form button{border: none;height: 46px;width: 105px;background-color: #317EF3;color: #fff;font-size: 15px;margin-left:-4px; }
</style>
</head>
<body>
<div class="top">
<span>上海：<img src="https://ss3.bdstatic.com/iPoZeXSm1A5BphGlnYG/icon/weather/aladdin/png_18/a7.png">
<em>8℃</em>
<em style="color: #3388FF;font-weight: bold;">優(yōu)</em>
<em>34</em>
<em>|</em>
<em><a href="#" title="換膚">換膚</a></em>
<em><a href="#" title="消息">消息</a></em></span>
<div class="top_right">
<span><em><a href="#" title="新聞">新聞</a></em>
<em><a href="#" title="hao123">hao123</a></em>
<em><a href="#" title="地圖">地圖</a></em>
<em><a href="#" title="視頻">視頻</a></em>
<em><a href="#" title="貼吧">貼吧</a></em>
<em><a href="#" title="學(xué)術(shù)">學(xué)術(shù)</a></em>
<em style="font-weight: normal;"><a href="#" title="你的賬戶">你的賬戶</a></em>
<em style="font-weight: normal;"><a href="#" title="你的賬戶">設(shè)置</a></em>
<em><a href="#" title="更多產(chǎn)品">更多產(chǎn)品</a></em></span>
</span>
</div>
</div>
<div class="boximg"><img src="images/baidu.png">
</div>
<div class="s_form">
<form method="post" action="www.baidu.com">
<input type="text" name="search">
<button>百度一下</button>
</div>
</form>
</body>
</html>
感覺不會做了！百度一下上面有點(diǎn)間距不知道咋搞。
批改老師：滅絕師太批改時間：2019-01-11 18:40:25
老師總結(jié)：完成的不錯，input和button分別做一個左浮動再將.s_form給居中一下，就可以啦！代碼還需要簡化！
