十二列栅格：原生替代 Bootstrap | 星雨笔录

核心： 十二列栅格把横向空间均分为 12 份，每个组件控制跨列数量。

最小示例：

.row { display: grid; grid-template-columns: repeat(12, 1fr); gap: 12px; }
.col-4 { grid-column: span 4; }
.col-8 { grid-column: span 8; }

学完能做： 理解十二列栅格的划分和跨列规则。