标记
用于标记文本以示强调。
这个设计系统 是UI元素的集合
import { Mark, Text } from "@chakra-ui/react"
const Demo = () => {
return (
<Text>
The <Mark variant="subtle">design system</Mark> is a collection of UI
elements
</Text>
)
}
用法
import { Mark } from "@chakra-ui/react"
<Text>
The <Mark>design system</Mark> is a collection of UI elements
</Text>
示例
变体
使用 variant
属性来改变标记的颜色。
这个 设计系统 是UI元素的集合
这个设计系统 是UI元素的集合
这个设计系统 是UI元素的集合
这个设计系统 是UI元素的集合
import { For, Mark, Stack, Text } from "@chakra-ui/react"
const Demo = () => {
return (
<Stack gap="6">
<For each={["subtle", "solid", "text", "plain"]}>
{(variant) => (
<Text key={variant}>
The <Mark variant={variant}>design system</Mark> is a collection of
UI elements
</Text>
)}
</For>
</Stack>
)
}