多列布局
使用响应式网格并排展示内容，移动端纵向堆叠、桌面端展开，列数可配置为 1 至 4 列。
Columns 可在响应式网格中并排展示内容。网格在移动端纵向堆叠，在桌面端展开。
可在其中放置 Card、Tile、图片或自定义组件。
屏幕截图显示的是英文界面。
基本用法
以两列显示内容（默认设置）：
<Columns>
<Tile href="/components/tabs" title="Tabs" description="Organize content with tabs">
<img src="/_jd/images/tabs-preview.webp?v=mwdojjfh" alt="Tabs preview" />
</Tile>
<Tile href="/components/tabs" title="Tabs" description="Switch between views">
<img src="/_jd/images/tabs-preview.webp?v=mwdojjfh" alt="Tabs preview" />
</Tile>
</Columns>更多列
使用 cols={3} 或 cols={4} 创建更紧凑的布局：
<Columns cols={3}>
...
</Columns>选择列数
| 内容类型 | 建议列数 |
|---|---|
| 带图片的 Tile | 2-3 |
| 文字较多的项目 | 2 |
| 小型指标/统计数据 | 3-4 |
| 图片对比 | 2 |
响应式行为
列数会随屏幕宽度变化：
- 移动端（< 768px）：1 列
- 平板端（768px - 1024px）：最多 2 列
- 桌面端（> 1024px）：显示完整列数
Props
每行的列数。可设置为 1 到 4 之间的值。