ul的两个li之间空出了三个li的位置_html/css_WEB-ITnose

发布网友 发布时间:16小时前

我来回答

1个回答

热心网友 时间:15小时前

css布局 ul li 页面上用ul li 显示用户列表,不使用默认样式,li横向显示。主要样式如下:#ul_stuList {list-style: none;margin: 0px 0px 0px 0px;padding: 0px;}#ul_stuList li {float: left;margin-right: 16px;margin-top: 16px;background-color: lightgray;color: white;padding: 5px;border-radius: 4px;}#ul_stuList li:hover {background-color: #f7c434;cursor: pointer;}#ul_stuList li.liActive:hover {background-color: #e58e3c;cursor: pointer;}#ul_stuList .liActive {background-color: #e58e3c;}li是后台取数据回来拼接字符串后设置 $("#ul_stuList").html(stuHtml); 加进去的。但现在出现了两个li之间空出了三个li的位置的奇怪景象。如图:请各位指点迷津。

因为你第三个li高度比第四个大,由于是float:left,所以后面的会紧贴着左边显示,你第三个凸下来了,第五个就挡在那边了,第五个右边没地方了,所以第六个又贴着左边显示了。多谢了,就是这个原因。

声明声明:本网页内容为用户发布,旨在传播知识,不代表本网认同其观点,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。E-MAIL:11247931@qq.com