此页面上有脚本错误。虽然它是写给网站编辑,您可以在下面查看部分内容。

这篇翻译不完整。请帮忙从英语翻译这篇文章

}} {{CSSRef

font-display描述符确定字型如何根据是否以及何时它被下载并准备使用显示。

字体显示时间轴

字体显示时间线基于一个计时器,该计时器在用户代理尝试使用给定下载字体的那一刻开始。时间线分为三个时间段,在这三个时间段中指定使用字体的元素的渲染行为。

字体块周期
如果未加载字体,任何试图使用它的元素都必须渲染不可见的后备字体。如果在此期间字体表面已成功加载,则正常使用它。
字体交换期
如果未加载字体,任何尝试使用它的元素都必须呈现后备字体。如果在此期间字体表面已成功加载,则正常使用它。
字体失败期
如果未加载字体,用户代理将其视为导致正常字体回退的失败加载。

{{cssinfo}}

句法

/ *关键字值* /
font-display:auto;
font-display:block;
font-display:swap;
font-display:fallback;
font-display:可选;

auto
字体显示策略由用户代理定义。
block
给字体面临一个短暂的周期和无限的交换周期。
swap
为字体提供了一个非常小的块周期和无限的交换周期。
fallback
为字体提供了一个非常小的块周期和短暂的交换周期。
optional
为字体提供了一个非常小的块周期并且没有交换周期。

形式语法

{{csssyntax}}

例子

@ font-face {
  font-family:ExampleFont;
  src:url(/path/to/fonts/examplefont.woff)格式('woff'),
       url(/path/to/fonts/examplefont.eot)格式('eot');
  font-weight:400;
  font-style:normal;
  font-display:fallback;
}

产品规格

规范 状态 评论
{{SpecName('CSS4 Fonts','#font-display-desc','font-display')}} {{Spec2('CSS4 Fonts')}} 初始定义

浏览器兼容性

{{COMPAT( “css.at-rules.font-face.font显示”)}}

文档标签和贡献者

此页面的贡献者: tiger102010
最后编辑者: tiger102010,