文件名称:
详解css使既有浮动又有左右margin的多个元素两端对其
开发工具:
文件大小: 49kb
下载次数: 0
上传时间: 2020-12-14
详细说明：两端对齐效果
如上图中红色的9个div它们中间有间距，而最左边和最右边是没有间距的，这种布局如果使用css3的flex来实现是非常简单的，而如果要使用float布局就需要一些特殊的技巧了。
实现原理
红色的9个div左浮动，左右margin为25px，父容器左右margin为-25px，这样相当于是把父容器拉长了，因此就达到了两端对齐的效果。Bootstrap的栅格系统就是这么干的，bootstrap要求我们.col-xx-xx的父容器需要为.row，而.row的左右padding就为-15px。
示例代码
