扫码关注官方订阅号
演示效果:http://runjs.cn/detail/xxjybtf7
源码:http://runjs.cn/code/xxjybtf7
问题:为什么ul中的li标签不能够三个同行显示?
li的宽度是60+2,而ul的内容区是200px,足够三个li标签同行显示的呀,为什么效果中是两个同行呢
小伙看你根骨奇佳,潜力无限,来学PHP伐。
因为编码习惯
<ul> <li></li> <li></li> <ul>
其实在每个换行之间都是有空白文本的,这也导致也产生不必要的间距;例如你改为
<ul><li></li><li></li></ul>
就可以避免这种问题或者设置ul{font-size:0}li{font-size:12px}
我这边看到是三个同行啊:
display:inline-block如果li不是紧邻的(有空格或回车)中间会有几像素的间隙,所以可能会挤下来,可以给父元素加font-size:0来解决,也可以给li加float
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
因为编码习惯
其实在每个换行之间都是有空白文本的,这也导致也产生不必要的间距;
例如你改为
就可以避免这种问题
或者设置
ul{font-size:0}
li{font-size:12px}
我这边看到是三个同行啊:
display:inline-block如果li不是紧邻的(有空格或回车)中间会有几像素的间隙,所以可能会挤下来,可以给父元素加font-size:0来解决,也可以给li加float