扫码关注官方订阅号
为什么li和ul都要display:inline, 只保留li的display:inline也能实现结果?
去掉ul的inline和不去掉效果一样:因为.container类是他们的父类,text-align:center.样式,所以看起来效果一样。实际上,去除ul的display:inline样式,ul已经恢复为块级元素,宽度100%,如果为display:inline,ul的宽度是li的宽度之和。display:inline在这里的目的是让li水平,居中需要text-align:center来执行.至于ul加display:inline,使得ul的宽度为内容宽度之和,不用撑满整行的宽度,可以在这行上再扩展其他行内元素
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
扫描下载App
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
去掉ul的inline和不去掉效果一样:因为.container类是他们的父类,text-align:center.样式,所以看起来效果一样。实际上,去除ul的display:inline样式,ul已经恢复为块级元素,宽度100%,如果为display:inline,ul的宽度是li的宽度之和。display:inline在这里的目的是让li水平,居中需要text-align:center来执行.至于ul加display:inline,使得ul的宽度为内容宽度之和,不用撑满整行的宽度,可以在这行上再扩展其他行内元素