Text

Text 组件用于创建各种文本元素，提供一致的排版样式和灵活的定制选项。该组件适用于需要统一文本样式的场景，如段落、提示文本、标签等。

基础用法

这是一段普通文本

<Text>这是一段普通文本</Text>

不同大小

超小文本

小文本

中等文本

大文本

超大文本

<Text size="xs">超小文本</Text>
<Text size="sm">小文本</Text>
<Text size="md">中等文本</Text>
<Text size="lg">大文本</Text>
<Text size="xl">超大文本</Text>

文本颜色

主要颜色文本

次要颜色文本

强调色文本

柔和色文本

<Text color="primary">主要颜色文本</Text>
<Text color="secondary">次要颜色文本</Text>
<Text color="accent">强调色文本</Text>
<Text color="muted">柔和色文本</Text>

字体粗细

细体文本

常规文本

中等粗文本

半粗体文本

粗体文本

<Text weight="light">细体文本</Text>
<Text weight="normal">常规文本</Text>
<Text weight="medium">中等粗文本</Text>
<Text weight="semibold">半粗体文本</Text>
<Text weight="bold">粗体文本</Text>

文本对齐

左对齐文本

居中对齐文本

右对齐文本

两端对齐文本

<Text align="left">左对齐文本</Text>
<Text align="center">居中对齐文本</Text>
<Text align="right">右对齐文本</Text>
<Text align="justify">两端对齐文本</Text>

文本截断

这是一段很长的文本，将会被截断并显示省略号，这是一段很长的文本，将会被截断并显示省略号，这是一段很长的文本，将会被截断并显示省略号...

<Text truncate>这是一段很长的文本，将会被截断并显示省略号，这是一段很长的文本，将会被截断并显示省略号，这是一段很长的文本，将会被截断并显示省略号...</Text>

自定义样式

自定义背景和圆角

自定义颜色和下划线

<Text class="cosy:bg-yellow-100 cosy:px-2 cosy:py-1 cosy:rounded">自定义背景和圆角</Text>
<Text class="cosy:text-red-500 cosy:underline">自定义颜色和下划线</Text>