导航栏写法

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

转载最新推荐文章于 2024-07-26 18:14:04 发布 · 500 阅读

一、中间有缝隙（几乎不用）
用a标签，再转化inline-block,在加宽高
二、ul li a 标签

	.nav li {
		float: left;
		width: 160px;
		height: 80px;
		list-style: none;
	}
	.nav li a {
		width: 160px;
		height: 80px;
		display: block;
		text-align: center;
		line-height: 80px;
		color: #fff;
		text-decoration: none;
	}
	.nav li a:hover {
		background-color: #fff;
		color: #000;
	}

<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>