卡片
QCard组件是显示重要分组内容的好方法。 这种模式正在迅速成为应用、网站预览和电子邮件内容的核心设计模式。 它通过包含和组织信息来帮助观看者,同时还设置可预测的期望。
卡片具有一次可显示的大量内容,而屏幕尺寸通常很少,因此,卡片已迅速成为许多公司(包括Google和Twitter之类)的首选设计模式。
QCard组件特意是轻巧的,并且实质上是一个包含元素,该元素能够“容纳”任何其他合适的组件。
QCard API
QCardSection API
QCardActions API
用法
TIP
您可以使用卡片中的字体来制作精美的卡片。
基础
带有操作的卡片
以下是一些可通过align
属性用于操作的自定义对齐方式:
媒体内容
水平
在下面的示例中,请注意带有horizontal
属性的QCardSection,该属性包装了其他QCardSections。 还要注意,您可以在水平QCardSection的子级上直接使用col-*
类来控制大小。
在处理水平QCardSections时,建议您使用QImg组件而不是原生的<img>
。
各种内容
可展开的
在下面的示例中,单击右下角的圆形按钮以查看展开的操作。