使用<Card>组件在页面中显示卡片.

也可以使用markdown卡片容器语法, 替代<Card>组件.

titleRequiredstring

卡片标题.

iconOptionalstring | { svg: string }

显示在标题左侧的图标, 支持iconify所有图标, 也可以使用图片链接.

插槽

• default: 卡片详情内容.
• title: 自定义标题.

示例

<Card title="卡片标题" icon="twemoji:astonished-face">
  这里是卡片内容。
</Card>

<Card>
  <template #title>
    <p style="color: red">卡片标题</p>
  </template>
  这里是卡片内容。
</Card>

卡片标题

这里是卡片内容。

卡片标题

这里是卡片内容。

提示

在插槽内也可以使用markdown语法, 但需要注意的是, markdown语法需要与标签之间间隔一行. 否则将被识别为普通文本.

版权所有

版权归属：洱海

许可证：署名 4.0 国际 (CC-BY-4.0)

编辑此页

贡献者: 洱海

上一页徽章

下一页卡片容器