组件
卡片 Card
Card:卡片容器。圆角、位于第一层 elevation,边缘是一条发丝线。Root、Header、Title、Description、Content、Footer 各区块自带留白,可以按需组合。
#基础用法
The four treasures
Brush, ink, paper, and the inkstone.
A vessel rests at the first elevation, round where a control is square-cut. Sections compose in any subset.
<script setup lang="ts">
import { Card } from "@bysages/vue";
</script>
<template>
<Card.Root class="w-104">
<Card.Header>
<Card.Title>The four treasures</Card.Title>
<Card.Description>Brush, ink, paper, and the inkstone.</Card.Description>
</Card.Header>
<Card.Content>
<p>
A vessel rests at the first elevation, round where a control is square-cut. Sections compose
in any subset.
</p>
</Card.Content>
<Card.Footer class="flex gap-2 justify-end"> Updated this morning </Card.Footer>
</Card.Root>
</template>
#属性
#CardRoot
纯造型的部件——自身没有属性,沿用部件结构的共享样式。
#CardHeader
纯造型的部件——自身没有属性,沿用部件结构的共享样式。
#CardTitle
纯造型的部件——自身没有属性,沿用部件结构的共享样式。
#CardDescription
纯造型的部件——自身没有属性,沿用部件结构的共享样式。
#CardContent
纯造型的部件——自身没有属性,沿用部件结构的共享样式。
#CardFooter
纯造型的部件——自身没有属性,沿用部件结构的共享样式。