摘要：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>边框样式</title> <link rel="shortcut icon" type="image/x-icon" href="ima
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>边框样式</title>
<link rel="shortcut icon" type="image/x-icon" href="images/icon.png">
<link rel="stylesheet" type="text/css" href="css/index.css">
<link rel="stylesheet" type="text/css" href="layui/css/layui.css">
<style>
*{margin: 0px; padding: 0px;font-family: 微软雅黑;list-style: none;text-decoration: none;}
.clear{clear: both;}
/*导航*/
.header{width: 1280px;height: 32px;margin: 0px auto;}
.logo{float: left;margin-right: 20px;}
form{padding-top:3px;float: left;}
input{width: 200px;height: 2px;float: left;border: 1px solid #ccc;padding: 10px;}
button{width: 50px;height: 24px;float: left;background: #56932B;border:none;color: #fff;}
.header_right{float: right;}
.header_right_left{float: left;}
.dz{float: left;background-color: #F0F0F0;width: 80px;height: 32px;text-align: center;}
.dz a{color: #888;line-height: 30px;}
.dz a:hover{color: #FD6A21;}
.header_right_right{float: left;}
.header_right_right .yx{float: left;padding: 0px 10px;}
.header_right_right i{color: #7BBB16;font-weight: bolder;line-height: 32px;margin: 10px;}
.header_right_right span{width: 1px;height: 20px;border:1px solid #ccc;line-height: 32px;}
.xian{width: 100%;height: 1px;background: #ccc;}
.menu{width: 1280px;height:40px;background: #56932B;margin: 0px auto;}
.menu ul li{float: left;padding: 0px 10px;line-height: 40px;}
.menu ul li a{color: #fff;}
</style>
</head>
<body>
<!-- 导航 -->
<div class="header">
<div class="logo"><img src="images/logo.png" alt=""></div>
<form action="" method="get">
<input type="text" name="sousuo" placeholder="造梦西游5">
<button>搜索</button>
</form>
<div class="header_right">
<div class="header_right_left">
<div class="header_right_left_denglu dz"><a href="#">登录</a></div>
<div class="header_right_left_zhuce dz"><a href="#">注册</a></div>
</div>
<div class="header_right_right">
<div class="header_right_right_1 yx"><i class="layui-icon"></i>我玩过的</div>
<div class=" yx"><span></span></div>
<div class="header_right_right_2 yx"><i class="layui-icon"></i>猜你喜欢</div>
<div class=" yx"><span></span></div>
<div class="header_right_right_3 yx"><i class="layui-icon"></i>换肤</div>
</div>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<div class="xian"></div>
<div class="menu">
<ul>
<li><a href="">动作</a></li>
<li><a href="">体育</a></li>
<li><a href="">益智</a></li>
<li><a href="">射击</a></li>
<li><a href="">冒险</a></li>
<li><a href="">棋牌</a></li>
<li><a href="">策略</a></li>
<li><a href="">休闲</a></li>
<li><a href="">女生</a></li>
<li><a href="">装扮</a></li>
<li><a href="">儿童</a></li>
<li><a href="">过关</a></li>
<li><a href="">双人</a></li>
<li><a href="">笑话</a></li>
<li><a href="">漫画</a></li>
<li><a href="">动画片</a></li>
<li><a href="">手机游戏</a></li>
<li><a href="">网页游戏</a></li>
</ul>
</div>
</body>
</html>
批改老师：灭绝师太批改时间：2018-11-01 23:01:56
老师总结：做的还不错, 能学以致用是最棒哒, 继续加油吧
