css - 如何实现这种三列布局?
大家讲道理
大家讲道理 2017-04-17 13:00:12
[HTML讨论组]

要求结构是

  • ...

顺序如图所示

更新我希望每个图片之间横隔的距离是相等的,图片4个箭头处的宽度是相等的
如图

大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

全部回复(6)
PHP中文网

bootstrap

巴扎黑

可以去看一下bootstrap那块的栅格系统

阿神
ul{
    margin-left:20px;
    list-style:none;
    width:230px;
}
ul li{
    float:left;
    margin:20px 20px 0 0;
    width:50px;
}
阿神

。。。好无奈啊,每个li的width:30%,margin-right:2.5%,
ul:padding-left:2.5%

迷茫

设置每3个li宽度和一行之间的li中间和两边宽度加起来等于整个屏幕宽度的100%就可以了

怪我咯

用box-sizing: border-box
跟padding
然后width设置为33.33%
这个是最简单的方法

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号