CSS 的 font-optical-sizing 属性用于设置是否应优化文本渲染以以不同大小查看。
可能的值
- none:未修改字形的形状,以便浏览器以最佳方式查看。
- auto:修改了字形的形状,以便浏览器以最佳方式查看。
适用于
所有 HTML 元素。
DOM 语法
object.style.fontOpticalSizing = "none|auto";
CSS font-optical-sizing - 基本示例
下面是一个示例:
<html>
<head>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Montserrat&display=swap">
<style>
p {
margin-bottom: 5px;
border: 2px solid red;
}
.eng {
font-family: "Montserrat", sans-serif;
}
.opt-no {
font-optical-sizing: none;
}
.opt-yes {
font-optical-sizing: auto;
}
</style>
</head>
<body>
<h3>Optical sizing -none</h3>
<p class="eng opt-no">Check the optical sizing</p>
<h3>Optical sizing -auto</h3>
<p class="eng opt-yes">Check the optical sizing</p>
</body>
</html>