CSS font-variant-numeric 属性-之路教程

CSS font-variant-numeric 属性值说明

值	描述
normal	未启用使用备用字形。
<numeric-figure-values>	控制用于数字的数字。
<numeric-spacing-values>	控制用于数字的图的尺寸。
<numeric-fraction-values>	控制用于分数的晶格。
ordinal	强制使用特殊的字形进行序数标记，如1st，2nd，3rd。它对应于OpenType值ordn。
slashed-zero	使用斜杠迫使使用0。当O和0没有区分时，需要这一点。它对应于OpenType值零。
initial	它使属性使用其默认值。
inherit	它从其父母元素继承了属性。

语法

font-variant-numeric: normal | <numeric-figure-values> | <numeric-spacing-values> | <numeric-fraction-values> | ordinal | slashed-zero;

font-variant-numeric 属性示例：

<!DOCTYPE html>
<html>
  <head>
    <title>The title of the document </title>
    <style>
      .p1 {
        font-variant-numeric: oldstyle-nums;
      }
      .p2 {
        font-variant-numeric: diagonal-fractions;
      }
    </style>
  </head>
  <body>
    <h2>Font-variant-numeric 属性示例</h2>
    <p class="p1">001528931</p>
    <p class="p2">952321313500</p>
  </body>
</html>

CSS font-variant-numeric 属性

font-variant-numeric 属性支持 OpenType 字体格式，以控制数字、分数和序数标记的替代字形的使用。

数字可以有变体，例如序数（例如 1st）、分数（例如 1/2）。
与字母不同，它们不会改变内容的含义，但这些变化会增加另外的上下文，并可能对易读性产生影响。

主要的问题是可以最大限度地使用 font-variant-numeric 和 font-variant 的字体数量有限。

有大量与 OpenType 兼容的字体，但使用 font-variant-numeric 的所有功能的选项并不多。

初始值	normal
应用于	所有元素。它还适用于伪元素::first-letter 和 ::first-line。
继承	可继承
可动画的	离散的。
版本	CSS3.
DOM 语法	object.Style.FontVariantNumeric =“Slashed-Zero”;

日期：2020-06-02 22:14:26 来源：oir作者：oir

←CSS font-variant-ligatures 属性

CSS 字体→

CSS font-variant-numeric 属性值说明

语法

font-variant-numeric 属性示例：

目录