网页导航栏中常用li标签嵌套超链接用法

在网页中导航，菜单等部分的设计，需要使用到列表ul，其中的列表项li一般会嵌套a标签，超链接到指定url。在li标签嵌套a链接时，a链接中通常包含文字。

为了使文字居中，而且当点击li标签时，整个区域都可以响应到a链接，操作不是特别清晰，做了如下总结：

<ul>
<li><a href='index.html'> 首页 </a></li>"
<li><a href='staff.html'>员工风采</a></li>
<li><a href=''>部门精粹</a></li>
<li><a href=''>深入仓库</a></li>
<li><a href=''>我要登录</a></li>
</ul>

.container-header .aside ul>li{
cursor: pointer;
list-style: none;
//color: @backgroundColor-black;
font-size:14px;
font-family:"微软雅黑 Light";
//font-weight: bolder;
float: left;
//vertical-align: middle;
width:15%;
border:1px solid @backgroundColor-white;
height:70px;
}
.container-header .aside ul>li a{
list-style: none;
color: @backgroundColor-black;
text-decoration: none;
display: inline-block;
//width:100%;
padding:24px 30px;
height:100%;
}

直接给a标签设置盒子模型（padding:24px 30px;），即可使a标签整个填充li标签，使点击操作可以响应整个li标签区域。