如何在 CSS 中使用 font-optical-sizing 属性？

无论我们现在制作什么 Web 应用程序或网站，我们都会确保它与所有屏幕尺寸兼容。所以 CSS 带有font-optical-sizing属性，它设置正在渲染的文本是否针对不同的屏幕尺寸进行了优化。它允许浏览器调整字体字形的轮廓，使它们在不同尺寸下更符合条件。

如果字体支持font-optical-sizing属性，那么使用这将是光学调整大小的最有效方法。如果我们谈论支持这个属性的字体，那么我们可以说所有的可变字体都支持这个属性。对于那些具有光学尺寸变化轴的字体，光学尺寸本身默认启用。

句法：

font-optical-sizing属性的语法如下。

font-optical-sizing: value;

属性值：此属性接受下面描述的属性值。

• keyword_values：该属性的值是指“auto”、“none”等定义的值。
• global_values：该属性的值是指由“inherit”、“initial”、“unset”定义的值。

示例 1：下面是使用属性值“ auto ”来说明使用font-optical-sizing属性的示例。网页会自行调整以保持字形或字符的形状以获得最佳查看效果。

HTML

  

  


  
Hello GeeksforGeeks!

  

输出：

自动设置

示例 2：下面是使用值“ initial ”说明font-optical-sizing属性的示例。

HTML

  

    

  
Welcome to this Computer Science portal
  

输出：

初始设置