使用Bulma的.columns容器可自动实现等高列布局，子元素.column会随最高列等高，支持宽度类如is-one-third控制比例，并可通过is-gapless去除间隙。
用 Bulma 实现等高列布局非常简单，不需要额外写复杂的 CSS。Bulma 内置的 Flexbox 网格系统（基于 .columns 和 .column）天然支持等高列，只要把多个 .column 放在同一个 .columns 容器中即可。
使用 .columns 创建等高列
Bulma 的 .columns 是一个 Flex 容器，默认使用 Flexbox 布局，它的子元素 .column 会自动拉伸到相同高度。
这是第二列的内容。
内容比较长，会撑高整个行。
多几段文字来测试高度是否一致。
是的，它们会保持等高。
GNCMS可视化拖拽公司网站模板1.0.0下载高端网络建设公司设计类网站模板 IT互联网移动建站类网站源码(带手机版数据同步)本套模板采用现在非常流行的全屏自适应布局设计，且栏目列表以简洁，非常时尚大气。后台支持可视拖拽编辑。 模板特点：1、手工书写DIV+CSS、代码精简无冗余。2、自适应结构，全球先进技术，高端视觉体验。3、SEO框架布局，栏目及文章页均可独立设置标题/关键词/描述。4、后台直接修改联系方式、传真、邮箱、地址等，修改更加方
第三列，即使内容少，也会和最高的一列一样高。
上面代码中，三列的高度会自动对齐，以最高的那一列为准。
控制列宽比例
你可以通过给 .column 添加宽度类来设置不同比例的列，比如：
-
is-one-third：占 1/3 宽度 -
is-half：占一半 -
is-four-fifths：占 4/5 - 或者不设，让 Flex 自动分配空间
示例：两列布局，左侧窄，右侧宽
侧边栏
主内容区，更宽，且高度与侧边栏一致。
去除列间间隙（可选）
Bulma 默认在列之间加入间隙（gap）。如果你想要紧凑布局，可以添加 is-gapless 类：
没有间距的列高度依然相等
基本上就这些。Bulma 的 Flexbox 设计让等高列变得非常自然，不需要 JavaScript 或 hack 样式。只要结构正确，等高效果自动生效。
