CSS - font-optical-sizing 属性

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>

打印页面