网页导航栏中常用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标签区域。