css background 充满自适应_css如何实现三列等宽自适应布局（不等高、等高）？

（一）三列等宽不等高布局

html布局：

方法一：瀑布流布局： multi-columns 布局

第①种：

第②种：

方法二：Flexbox布局

参考：多列等宽高度不固定的几种css布局（文档流、浮动、瀑布流、flex、flexbox）_Artful_Dodger的博客-CSDN博客_css3瀑布流 不等高

（二）三列等宽等高布局

html布局：

方法一：flex 布局

第①种：父容器设置 display:flex； 子元素设置 flex:1

第②种：父容器使用 display:flex; justify-content:space-between；子元素设置为 30%

方法二：绝对布局

方法三：使用浮动

参考：css实现等宽3列布局_fufang0303的博客-CSDN博客_三列等宽布局

————————————————

版权声明：本文为CSDN博主「Windyluna」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。

原文链接：

css实现三列等宽自适应布局（不等高、等高）_不同场景下的水平居中-CSDN博客​blog.csdn.net