卡片标题
这里是卡片内容。
外观
约 307 字大约 1 分钟
2025-12-24
当你需要将多个卡片排列, 可以使用<CardGrid>组件. 在空间足够时, 多个卡片会自动排列.
colsRequirednumber | { sm: number, md: number, lg: number }
2
卡片排列列数.
组件默认会根据屏幕宽度自动调整列数. 在空间足够时, 默认显示双列, 小屏幕下显示单列.
你可以通过cols配置列数. 当传入number时, 所有尺寸均显示为number个卡片.
传入{ sm: number, md: number, lg: number }时, 根据屏幕宽度自动调整列数.
sm : < 768pxmd : >= 768px < 960pxlg : >= 960px建议传入的number不超过3.
<CardGrid>
<Card title="卡片标题" icon="twemoji:astonished-face">
这里是卡片内容。
</Card>
<Card title="卡片标题" icon="twemoji:astonished-face">
这里是卡片内容。
</Card>
</CardGrid>
<CardGrid>
<LinkCard title="卡片标题" href="/" />
<LinkCard icon="twemoji:astonished-face" title="卡片标题" href="/" />
</CardGrid>卡片标题
卡片标题
版权归属:洱海