.container li中去掉浮动，它们中间的间隔会变大，是什么原因？
我有一个疑问啊，.container li中的display：inline不加也可以，还有就是它的float：left必须有，如果没有的话，margin-right:8px中间还有间隔，是什么原因呢？
秋天瘦了满地的落叶
2016-04-29
2 回答
li是块级元素，本来是垂直排列，如果想要显示在一行，就要使用display：inline把它变成内联元素，此时三个数字是仅仅挨在一起的，需要使用margin-right:8px让它们产生距离。
而至于float：left和display：inline在这里好像只留一个就好了，是因为二者的区别在于，float：left可以设置width和height，而display：inline不能设置，此节内容没有设置宽高让大家觉得二选一即可，如果以后需要设置宽高的话，二者需要一起使用。如下CSS代码，你可以在页面中试一下，注释掉float：left，宽高将不起作用。
.container li{
background:grey;
float:left; //把这句注释掉看看页面变化
display:inline;
margin-right:8px;
width:100px;
height:50px;
}你还可以参考一下wiki中的类似问题“CSS display:inline和float:left两者区别”，链接是：http://www.imooc.com/wiki/detail/id/71
举报
0/150
提交
取消
