为什么这个css设置后这么奇怪？？

问题描述

问 题

<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就可以了

这篇关于为什么这个css设置后这么奇怪？？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！