CSS仿站——凡客VANCL1--头部区域制作

CSS仿站——凡客VANCL1--头部区域制作

html:

<!--顶部区域 开始-->
<div id="top">
	<div class="m2">
		<div class="tright">
			<span>
				您好，欢迎光临凡客诚品！ 
			</span>
			<span>
				<a href="">登录</a>
				&nbsp;&nbsp;|&nbsp;&nbsp;
				<a href="">注册</a>
				&nbsp;&nbsp;
				<a href="">我的订单</a>
				&nbsp;&nbsp;
				<a href="">网站公告</a>
			</span>
		</div>
	</div>
</div>
<!--顶部区域 结束-->

css:

*{
	margin: 0;
	padding: 0;
}
body{
	font-size: 14px;
	font-family: "微软雅黑";
}
#top{
	width: 100%;	
	height: 31px;
	background-color: #F7F7F7;
	border-bottom: 1px solid #CCCCCC;
}
.m2{
	width: 1130px;
	height: 31px;
	/*水平居中*/
	margin: 0 auto;
	background-color: pink;
}
#top .tright{
	width: 600px;
	height: 31px;
	/*行高*/
	line-height: 31px;
	background-color: skyblue;
	/*浮动:右浮动*/
	float: right;
}
#top .tright a{
	color: #808080;
	/*去除超链接的下划线*/
	text-decoration: none;
}
#top .tright a:hover{
	color: #A10000;
}