QCard 组件是展示重要分组内容的绝佳方式。这种模式正在迅速成为应用、网站预览和电子邮件内容的核心设计模式。它通过包含和组织信息来帮助查看者，同时建立可预测的期望。

由于要同时显示大量内容，而且屏幕空间往往有限，卡片已迅速成为许多公司（包括 Google 和 Twitter 等）的首选设计模式。

QCard 组件有意地保持轻量级，本质上是一个容器元素，能够“承载”任何合适的其他组件。

使用

基本

带操作

以下是一些您可以通过 align 属性为操作使用的自定义对齐方式

媒体内容

水平

在下面的示例中，请注意带有 horizontal 属性的 QCardSection 包裹了其他 QCardSection。另请注意，您可以直接在水平 QCardSection 子元素上使用 col-* 类来控制大小。

建议您在处理水平 QCardSection 时使用 QImg 组件而不是原生 <img>。

各种内容

可扩展

在下面的示例中，单击右下角的圆形按钮以查看扩展操作。