DIV淘宝导航标题

Original 2019-04-26 00:33:14 259
abstract: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>淘宝网站导航</title> <link rel="stylesheet" href="nav1.css" /> &l

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>淘宝网站导航</title>

<link rel="stylesheet" href="nav1.css" />

</head>

<body>

<div class="header">

<div class="header_content">

<div class="content_left">

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

<a href=""style="color: coral; text-decoration: none;">亲,请登录</a>

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

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


</div>

<div class="content_right">

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

<a href=""class="">购物车</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>

</body>

</html>

* {

margin: 0px;

padding: 0px;

}


.header {

width: 100%;

height: 40px;

background-color: #CCCCCC;

}


.header_content {

width: 900px;

height: 40px;

line-height: 40px;

margin: 0 auto;

}


.content_left {

height: 40px;

float: left;

}


.content_right {

width: 500px;

height: 40px;

float: right;

letter-spacing: 2px;

}


a {

text-decoration: none;

font-size: 13px;

}


.header_a {

display: inline-block;

color: black;

}


.header_a:hover {

color: #F0FFFF;

background-color: darkgreen;

}


Correcting teacher:查无此人Correction time:2019-04-26 13:32:04
Teacher's summary:完成的不错。可以把常用的css样式写到单独的文件里,随时可以使用。继续加油。

Release Notes

Popular Entries