导航布局作业练习

原创 2019-01-21 00:07:50 246
摘要:<!DOCTYPE html><html ><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv=

<!DOCTYPE html>


<html >


<head>


<meta charset="UTF-8">


<meta name="viewport" content="width=device-width, initial-scale=1.0">


<meta http-equiv="X-UA-Compatible" content="ie=edge">


<!-- <link rel="stylesheet" type="text/css" href="dhbj.css"> -->

<title>导航布局</title>


<style>


*{margin: 0px; padding: 0px;}


a{text-decoration: none; color:#6c6c6c; font-size: 13px; }


.clear{clear:both;}


.header{width: 100%; background-color:#F5F5F5;}


.header_content{ width:1200px ; margin: 0px auto; line-height:40px;}


.header_left{height:40px; float: left;}


.header_left a{margin-right: 5px}


.header_content a:hover{color: #ff5000}


.header_right{width: 700px; height:40px; float: right;}


.header_a{display: inline-block;height:40px; width:90px;text-align: center;}


.header_a:hover{background-color:#fff}


</style>


</head>


<body>


<div class="header">


<div class="header_content">


<div class="header_left">


<a href=""class="header_a">中国大陆</a>


<a href=""class="header_a">亲,请登录</a>


<a href=""class="header_a">免费注册</a>


<a href=""class="header_a">手机逛淘宝</a>                  


</div>


<div class="header_right">


<a href="" class="header_a">我的淘宝</a>


<a href=""class="header_a">购物车</a>


<a href=""class="header_a">收藏夹</a>


<a href=""class="header_a">商品分类</a>


<a href=""class="header_a">卖家中心</a>


<a href=""class="header_a">联系客服</a>


<a href=""class="header_a">网站导航</a>                  


</div>


</div>


<div class="clear"></div>


</div>    


</body>


</html>





批改老师:天蓬老师批改时间:2019-01-21 09:09:13
老师总结:以后提交代码,必须做二件事: 1. 写明你的代码是做什么的, 最好配一张图 2. 把代码放在代码块中再发布 直接将代码复制提交, 这是在敷衍,是对自己的不负责任

发布手记

热门词条