<nav id="nav_4">
<li id="f1">客户管理</li>
<li>市场活动</li>
<li>外包管理</li>
</nav>
#nav_4{
border:red dotted 1px;
}
#nav_4>li{
display:inline;
background:url("../img/圆角矩形-2.png") no-repeat 0px 0px;
background-size:100% 100%;
border:red dotted 1px;
padding:10px 22px;/*盒子宽92px*/
font-family:微软雅黑;
font-size:12px;
color:#ffffff;
margin:0px;
}
问题是:nav元素为什么高度不等于li元素的高度??
而且li元素的内容消失不见??
而且将代码隔离却显示部分代码为红色??
你把li中字体颜色设置了白色……当然看不到了
高度问题是你设置了display:inline;改为inline-block就可以了
部分代码为红色,是因为红色部分前面那句注释,遇到 */ 就认为注释结束了
li 高度和 ul 不同, 原因是你设置了 display: inline, inline-level 元素的高度会和你内容的字体大小和padding 相关,和你的ul高度无关,如果你设置了 display: inline-block 会和父级容器保持一致。