# 文字层级 Text

分类：基础 · React：Text

标题、正文、说明、等宽字的固定几档：层级靠字号和字重，不靠颜色。

## 示例
```html
<div class="xxd-text-pair">
  <h2 class="xxd-text" data-variant="heading2">外观</h2>
  <p class="xxd-text" data-variant="caption">只影响这个插件</p>
</div>
<p class="xxd-text">正文 13px <span class="xxd-text" data-variant="mono">--r-sm</span></p>
```

## 属性与类名
- `data-variant`：display | heading1 | heading2 | heading3 | body | secondary | caption | mono | mono-secondary | success | danger | warning
- `data-size`：xs | sm | base | lg
- `data-truncate`：一行省略
- 类名：`xxd-text` `xxd-text-pair`

## 键盘与读屏
- 标题用真正的 h1–h3（按页面层级，不跳级），不要用加粗的 p 冒充
- 说明文字用 --muted（≥ 4.5:1），不要更浅

## 规则
- 字重只有 400 / 500 / 600
- 相关的字靠得更近
- 不改字距
- 行内等宽字 0.92em