HTML+CSS实现导航页

最新推荐文章于 2024-07-26 14:14:21 发布

yeruo

最新推荐文章于 2024-07-26 14:14:21 发布

阅读量3.4k

点赞数 3

分类专栏：网页文章标签： HTML CSS 导航页

本文链接：https://blog.csdn.net/yeruo/article/details/46807757

版权

网页专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>导航</title>
		<style type="text/css">
			*
			{margin:0px;
			padding:0px;
			}
			.nav{
				width:960px;
				height:33px;
				background-color:#CCC;
				font-size:14px;
				font-family:"微软雅黑";
				margin:0px auto;<!-- 居中 -->
				
			}
			.nav ul{
				line-height:33px;
				margin-left:40px;
			}
			.nav ul li{
				float:left;
				width:140px;
				list-style:none;
	
			}
			.nav ul li a{
				font-size:14px;
				text-decoration:none;
				
			} 
			.nav ul li a:hover {
				background-color:#FFF;
				padding:5px 20px;
				color:#000;
				border:solid 3px;
			}
		</style>
	</head>
	<body>
		<div class="nav">
			<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>
			</ul>
		</div>
	</body>
	
</html>