Components

块引用

来自其他来源的块级引用。

Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Blockquote>
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>

API 参考

¥API Reference

此组件基于 blockquote 元素并支持 常用边距属性

¥This component is based on the blockquote element and supports common margin props.

PropTypeDefault
asChild
boolean
No default value
size
Responsive<enum>
No default value
weight
Responsive<"light" | "regular" | "medium" | "bold">
No default value
color
enum
No default value
highContrast
boolean
No default value
truncate
boolean
No default value
wrap
Responsive<"wrap" | "nowrap" | "pretty" | "balance">
No default value

示例

¥Examples

尺寸

¥Size

使用 size 属性控制大小。

¥Use the size prop to control the size.

Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Flex direction="column" gap="5">
<Box maxWidth="300px">
<Blockquote size="1">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Box>
<Box maxWidth="350px">
<Blockquote size="2">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Box>
<Box maxWidth="400px">
<Blockquote size="3">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Box>
<Box maxWidth="450px">
<Blockquote size="4">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Box>
<Box maxWidth="500px">
<Blockquote size="5">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Box>
<Box maxWidth="550px">
<Blockquote size="6">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Box>
<Box maxWidth="600px">
<Blockquote size="7">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Box>
<Box maxWidth="650px">
<Blockquote size="8">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Box>
<Box maxWidth="1000px">
<Blockquote size="9">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Box>
</Flex>

重量

¥Weight

使用 weight 属性设置文本粗细。

¥Use the weight prop to set the text weight.

Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Flex direction="column" gap="3" maxWidth="500px">
<Blockquote weight="regular">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
<Blockquote weight="medium">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
<Blockquote weight="bold">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Flex>

颜色

¥Color

使用 color 属性指定特定的 color

¥Use the color prop to assign a specific color.

Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Flex direction="column" gap="3" maxWidth="500px">
<Blockquote color="indigo">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
<Blockquote color="cyan">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
<Blockquote color="orange">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
<Blockquote color="crimson">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Flex>

高对比度

¥High-contrast

使用 highContrast 属性增加与背景的颜色对比度。

¥Use the highContrast prop to increase color contrast with the background.

Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Flex direction="column" gap="3" maxWidth="500px">
<Blockquote color="gray">
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
<Blockquote color="gray" highContrast>
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Flex>

截断

¥Truncate

当文本溢出容器时,使用 truncate 属性用省略号截断文本。

¥Use the truncate prop to truncate text with an ellipsis when it overflows its container.

Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Flex maxWidth="500px">
<Blockquote truncate>
Perfect typography is certainly the most elusive of all arts. Sculpture in
stone alone comes near it in obstinacy.
</Blockquote>
</Flex>
Previous标题
Next代码