摘要:<!DOCTYPE html><html><head> <title></title> <meta charset="utf-8"> <style type="text/css"> *{margin:0px;padding:0px;}
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
*{margin:0px;padding:0px;}
.nav{width: 100%;height: 60px;background-color:#1E1E1E;}
ul li{float:left;background-color:#ccc;list-style: none;width:150px;height:60px;text-align: center;line-height: 60px;font-size:24px;margin:0px 2px;}
ul li:nth-child(1){margin-left:755px;}
ul li:hover{background-color:pink;}
.box1{width:480px;height:270px;background-color: #CCC;float: left;margin:10px 30px;margin-left:180px;text-align: center;}
.box2{width:480px;height:270px;background-color: #CCC;float: left;margin:10px 30px;text-align:center;}
</style>
</head>
<body>
<div class="nav">
<ul>
<li>首页</li>
<li>天气查询</li>
<li>地图查询</li>
<li>航班查询</li>
<li>酒店查询</li>
<li>其他信息查询</li>
</ul>
</div>
<div class="clear"></div>
<div class="box1">天气查询图</div>
<div class="box2">地图查询图</div>
<div class="box2">航班查询图</div>
<div class="box2">其他信息查询图</div>
</body>
</html>
批改老师:灭绝师太批改时间:2018-11-09 12:28:04
老师总结:完成的不错,可以将上课知识融入到自己的小案例,继续保持