卡片

卡片提供了一个灵活且可扩展的内容容器。

用法

卡片还提供了一套方便的子组件例如CardBody卡体,卡片页眉,卡片页脚，以及更多（请参见下文）。

导入{卡片，CardHeader、，CardBody、，卡片页脚，__将文本作为文本进行实验，__实验性标题作为标题，}来自“@wordpress/components”；函数Example（）{返回(<卡片>＜卡片标题＞<标题级别={4}>卡片标题</CardHeader><卡体>卡片内容</CardBody><卡片页脚><文本>卡片页脚</CardFooter></卡>);}

道具

标高：编号

立面阴影的大小，基于样式系统的立面系统。这可能有助于突出显示某些内容。有关更多信息，请查看高程.

• 必需：否
• 违约：0

isBorderless:boolean（无边界）

渲染时不带边框。

• 必需：否
• 违约：假

isRounded：布尔值

使用圆角渲染。

• 必需：否
• 违约：真实的

大小：字符串

确定组件中的填充量。

• 必需：否
• 违约：中等的
• 允许的值：x小,小的,中等的,大的

继承的道具

卡片也继承所有表面道具.

子组件

该组件提供了一组子组件，可用于组成各种接口。

• <CardBody/>
• <CardDivider/>
• <CardFooter/>)
• <CardHeader/>)
• <CardMedia/>)

子组件示例

导入{卡片，CardBody、，CardDivider、，卡片页脚，CardHeader、，CardMedia，}来自“@wordpress/components”；常量示例=（）=>(<卡片><CardHeader></CardHeader><CardBody></CardBody><CardDivider/><CardBody></CardBody><卡媒体><img src=“…”/></Card媒体><CardFooter></卡片页脚></卡>);

上下文

<卡片/>的子组件连接到<卡片/>使用上下文.某些道具，如大小和是无边界的被传递到一些子组件。

在以下示例中<CardBody/>将以的大小进行渲染小的:

从“@wordpress/components”导入{Card，CardBody}；常量示例=（）=>(<卡片尺寸=“小”><CardBody></CardBody></卡>);

这些子组件的设计具有灵活性。根据需要，子组件可以覆盖Context属性。在下面的示例中，最后一个<CardBody/>将呈现指定的大小：

从“@wordpress/components”导入{Card，CardBody}；常量示例=（）=>(<卡片尺寸=“小”><CardBody></CardBody>＜CardBody＞</CardBody><CardBody size=“large”></CardBody></卡>);