CSS 属性 columns
CSS 属性 columns 用来设置元素的列宽和列数。
通常在报纸中容易看到将文字内容拆分为多列。
columns 是唯一可以分割内容的 CSS 布局方法。
它是一个简写属性，可在单个方便的声明中设置 column-width 和 column-count 属性。与所有简写属性一样，任何省略的子值都将设置为其初始值。
要将连续的内容块拆分为多列，可以轻松便捷的实现瀑布流布局。
<div class="cards"><div class="card" v-for="item in list"><img src="item" alt="photo"></div></div>
.cards {columns: 4 100px;padding: 1.5rem;}.card {background: #eaeaea;padding: 1rem;}.card img {max-width: 100%;}
当我们尝试调整视口宽度的时候，会自动变成三列，显示数量将根据可用空间量而变化。在没有媒体查询工作的情况下，属性自带响应式的功能！自动生成理想的列宽和列数。
columns 属性可以按任何顺序指定为下面列出的一个或两个值。
column-width：理想的列宽，auto 关键字。
column-count：元素内容应分成的理想列数，或 auto 关键字。