为了账号安全,请及时绑定邮箱和手机立即绑定

display:inline;行内显示失败?

视频中老师写css时,将li的样式设为display:inline;时没有效果,设置为display:inline-block;时才ok。
我测了一下是因为受到之前的一段代码
*:after,*:before{
    display: block;
    content:"";
}
的影响,这段注释掉时,li的display:inline;也能在一行里显示了。

但是,这是 为什么呢

正在回答

3 回答

因当"li" display:inline 时 此设置优先级差于*:after,*:before,所以 li 只能以块级排列
所以当注释掉*:after,*:before后li的display:inline优先级最高当以行级排列 "li"

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
CSS3实现漂亮ToolTips效果
  • 参与学习       42721    人
  • 解答问题       101    个

CSS3 实现鼠标悬停弹出信息提示框,学习达到对CSS3深入了解的目的

进入课程

display:inline;行内显示失败?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信