CSS - font-size-adjust 属性

CSS 的font-size-adjust属性用于调整元素的字体大小，以便在更改字体系列时保持一致的可读性。它有助于确保文本在不同字体下的显示大小相似，这在使用备用字体时尤其有用。

语法

font-size-adjust: none | number | initial | inherit;

属性值

值	描述
none	指定不根据 x-height 进行字体大小调整。默认值。
数字	指定一个数值，表示纵横比值，即字体 x-height 与字体系列属性指定的字体 x-height 的比率。
initial	将属性设置为其初始值。
inherit	从父元素继承属性。

CSS 字体大小调整属性示例

以下示例说明了使用不同值的font-size-adjust属性。

使用 none 值的字体大小调整属性

为了防止根据字体的纵横比进行任何调整，并直接使用指定的字体大小，而不根据字体的 x-height 修改它，我们将font-size-adjust属性的值设置为none。这是默认值。以下示例显示了这一点。

示例

<!DOCTYPE html>
<html>

<head>

   <style>
      body {
         font-family: Arial, sans-serif;
         font-size: 20px;
      }

      .adjusted {
         font-family: "Georgia", serif;
         font-size: 20px;
         font-size-adjust: none;
      }
   </style>
</head>

<body>
   <h2>
      CSS font-size-adjust property
   </h2>
   <p>
      This is text using the default font family (Arial)
      with a font size of 20px.
   </p>
   <p class="adjusted">
      This is text using Georgia with font-size-adjust
      set to none. The font size is not adjusted relative
      to Georgia's x-height.
   </p>
</body>

</html>

使用数值的字体大小调整属性

为了确保在使用 x-height 不同的字体切换时文本保持一致的可读性和大小，我们将一个正值（例如 0.25、1 等）指定给font-size-adjust属性。该值确保使用下一个字体渲染的文本与第一个字体的大小一致。以下示例显示了这一点。

示例

<!DOCTYPE html>
<html>

<head>
   <style>
      body {
         font-family: Arial, sans-serif;
         font-size: 20px;
      }

      .adjusted {
         font-family: "Georgia", serif;
         font-size: 20px;
         font-size-adjust: 0.5;
      }
   </style>
</head>

<body>
   <h2>
      CSS font-size-adjust property
   </h2>
   <p>
      This is text using the default font family.
   </p>
   <p class="adjusted">
      This is text using Georgia with font-size-adjust applied.
   </p>
</body>

</html>

注意：只有 Firefox 浏览器支持font-size-adjust属性。

支持的浏览器

属性
font-size-adjust	不支持	不支持	3.0	不支持	不支持

css_properties_reference.htm

打印页面