排版
用于控制元素字间距（tracking）的工具类。
| Class | Styles |
|---|---|
tracking-tighter | letter-spacing: var(--tracking-tighter); /* -0.05em */ |
tracking-tight | letter-spacing: var(--tracking-tight); /* -0.025em */ |
tracking-normal | letter-spacing: var(--tracking-normal); /* 0em */ |
tracking-wide | letter-spacing: var(--tracking-wide); /* 0.025em */ |
tracking-wider | letter-spacing: var(--tracking-wider); /* 0.05em */ |
tracking-widest | letter-spacing: var(--tracking-widest); /* 0.1em */ |
tracking-(<custom-property>) | letter-spacing: var(<custom-property>); |
tracking-[<value>] | letter-spacing: <value>; |
使用 tracking-tight 和 tracking-wide 等工具类来设置元素的字母间距：
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="tracking-tight ...">The quick brown fox ...</p><p class="tracking-normal ...">The quick brown fox ...</p><p class="tracking-wide ...">The quick brown fox ...</p>对于 Tailwind 默认提供的命名字母间距尺度来说，使用负值通常没有太大意义。但如果你自定义了使用数字的尺度，负值可能会很有用：
@theme { --tracking-1: 0em; --tracking-2: 0.025em; --tracking-3: 0.05em; --tracking-4: 0.1em;}要使用负的字母间距值，在类名前添加短横线将其转换为负值：
<p class="-tracking-2">The quick brown fox ...</p>Use the tracking-[<value>] syntax to set the 字母间距 based on a completely custom value:
<p class="tracking-[.25em] ..."> Lorem ipsum dolor sit amet...</p>For CSS variables, you can also use the tracking-(<custom-property>) syntax:
<p class="tracking-(--my-tracking) ..."> Lorem ipsum dolor sit amet...</p>This is just a shorthand for tracking-[var(<custom-property>)] that adds the var() function for you automatically.
Prefix a letter-spacing utility with a breakpoint variant like md: to only apply the utility at medium screen sizes and above:
<p class="tracking-tight md:tracking-wide ..."> Lorem ipsum dolor sit amet...</p>Learn more about using variants in the variants documentation.
Use the --tracking-* theme variables to customize the 字母间距 utilities in your project:
@theme { --tracking-最紧凑: -0.075em; }Now the tracking-最紧凑 utility can be used in your markup:
<p class="tracking-最紧凑"> Lorem ipsum dolor sit amet...</p>Learn more about customizing your theme in the theme documentation.