1. 字体排印
  2. font-smoothing

字体排印

font-smoothing

用于控制元素字体平滑的实用工具。

样式
抗锯齿
-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
子像素抗锯齿
-webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto;

示例

灰度抗锯齿

使用 antialiased 实用工具使用灰度抗锯齿渲染文本

敏捷的棕色狐狸跳过懒惰的狗。

<p class="antialiased ...">The quick brown fox ...</p>

子像素抗锯齿

使用 subpixel-antialiased 实用工具使用子像素抗锯齿渲染文本

敏捷的棕色狐狸跳过懒惰的狗。

<p class="subpixel-antialiased ...">The quick brown fox ...</p>

响应式设计

前缀 -webkit-font-smoothing-moz-osx-font-smoothing实用工具 带有像 md: 这样的断点变体,仅在中等 屏幕尺寸及以上应用该实用工具

<p class="antialiased md:subpixel-antialiased ...">  <!-- ... --></p>

了解有关在变体文档中使用变体的更多信息。

版权所有 © 2025 Tailwind Labs Inc.·商标政策