排版
用于控制文本装饰粗细的实用工具。
| 类名 | 样式 |
|---|---|
decoration-<number> | text-decoration-thickness: <number>px; |
decoration-from-font | text-decoration-thickness: from-font; |
decoration-auto | text-decoration-thickness: auto; |
decoration-(<custom-property>) | text-decoration-thickness: var(<custom-property>); |
decoration-[<value>] | text-decoration-thickness: <value>; |
使用 decoration-<number> 实用工具，如 decoration-2 和 decoration-4 来更改元素的文本装饰粗细
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.
<p class="underline decoration-1">The quick brown fox...</p><p class="underline decoration-2">The quick brown fox...</p><p class="underline decoration-4">The quick brown fox...</p>使用 decoration-[<value>] 语法 来设置文本装饰粗细基于完全自定义的值
<p class="decoration-[0.25rem] ..."> Lorem ipsum dolor sit amet...</p>对于 CSS 变量，你还可以使用 decoration-(<custom-property>) 语法
<p class="decoration-(--my-decoration-thickness) ..."> Lorem ipsum dolor sit amet...</p>这只是 decoration-[var(<custom-property>)] 的简写形式，它会自动为你添加 var() 函数。
前缀a text-decoration-thickness 实用工具 与断点变体（如 md:）一起使用，以便仅在中等 屏幕尺寸及以上尺寸时应用该实用工具
<p class="underline md:decoration-4 ..."> Lorem ipsum dolor sit amet...</p>了解更多关于在变体文档中使用变体的信息。