Lzh on GitHub

font-smoothing

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

快速参考

类别样式
antialiased-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
subpixel-antialiased-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: auto;

示例

灰度抗锯齿

使用 antialiased 工具以灰度抗锯齿方式渲染文本: The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

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

次像素抗锯齿

使用 subpixel-antialiased 工具以次像素抗锯齿方式渲染文本: The quick brown fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

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

响应式设计

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

<p class="antialiased md:subpixel-antialiased ...">
  Lorem ipsum dolor sit amet...
</p>

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