CSS 字体平滑与渲染：font-smooth 与 text-rendering

概述

font-smooth 与 text-rendering 影响字体抗锯齿与渲染策略，兼容性与标准化有限。应谨慎使用，并以可读性与对比度为优先。

用法/示例

/* 非标准属性，仅在部分浏览器有效 */
.text { text-rendering: optimizeLegibility }

工程建议

• 不依赖非标准属性进行外观优化；从字重、字距与对比度入手提升可读性。
• 在高 DPI 显示与不同平台进行实际验证，避免过度优化导致反效果。
• 保持品牌字体的加载与回退策略，减少 FOUT/FOIT 影响。

参考与验证

• MDN：text-rendering — https://developer.mozilla.org/docs/Web/CSS/text-rendering
• MDN：font-smooth — https://developer.mozilla.org/docs/Web/CSS/font-smooth