From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/zh-cn/web/css/@font-face/src/index.html | 82 +++++++++++++++++++++++++++ 1 file changed, 82 insertions(+) create mode 100644 files/zh-cn/web/css/@font-face/src/index.html (limited to 'files/zh-cn/web/css/@font-face/src') diff --git a/files/zh-cn/web/css/@font-face/src/index.html b/files/zh-cn/web/css/@font-face/src/index.html new file mode 100644 index 0000000000..e209486348 --- /dev/null +++ b/files/zh-cn/web/css/@font-face/src/index.html @@ -0,0 +1,82 @@ +--- +title: src +slug: Web/CSS/@font-face/src +translation_of: Web/CSS/@font-face/src +--- +
{{CSSRef}}
+ +

{{cssxref("@font-face")}} 中的src描述符指定了包含字体数据的资源。@font-face 规则中需要指定这个属性。

+ +

它的值是一个有优先级的,以逗号分割的外部引用或者本地安装的字体名称。当需要使用字体时,用户代理(指浏览器的意思)将会使用以逗号分隔的参考集中能成功激活的第一个参考值。如果是包含无效数据的字体或者本地的字体资源不存在,用户代理将会忽略当前字体并且加载下一个字体。

+ +

与CSS中的其他URL一样,URL可以是相对的,在这种情况下,它相对于包含@ font-face规则的样式表的位置进行解析。对于SVG字体,URL指向文档中定义的包含SVG字体的元素。如果省略元素引用,则默认引用第一个定义字体。同样,字体容器只加载@font-face 规则给定的其中一种字体。片段标识符用于指示要加载的字体。如果容器格式缺少定义的片段标识符方案,将会使用一个简单的基于1的索引方案(e.g., "font-collection#1" for the first font, "font-collection#2" for the second font, etc.)

+ +

{{cssinfo}}

+ +

Syntax

+ +
/* <url> values */
+src: url(https://somewebsite.com/path/to/font.woff); /* Absolute URL */
+src: url(path/to/font.woff);                         /* Relative URL */
+src: url(path/to/font.woff) format("woff");          /* Explicit format */
+src: url('path/to/font.woff');                       /* Quoted URL */
+src: url(path/to/svgfont.svg#example);               /* Fragment identifying font */
+
+/* <font-face-name> values */
+src: local(font);      /* Unquoted name */
+src: local(some font); /* Name containing space */
+src: local("font");    /* Quoted name */
+
+/* Multiple items */
+src: local(font), url(path/to/font.svg) format("svg"),
+     url(path/to/font.woff) format("woff"),
+     url(path/to/font.otf) format("opentype");
+
+ +

Values

+ +
+
<url> [ format( <string># ) ]?
+
Specifies an external reference consisting of a {{cssxref("<url>")}}, followed by an optional hint using the format() function to describe the format of the font resource referenced by that URL. The format hint contains a comma-separated list of format strings that denote well-known font formats. If a user agent doesn't support the specified formats, it skips downloading the font resource. If no format hints are supplied, the font resource is always downloaded.
+
<font-face-name>
+
Specifies the name of a locally-installed font face using the local() function, which uniquely identifies a single font face within a larger family. The name can optionally be enclosed in quotes.
+
+ +

Formal syntax

+ +
{{csssyntax}}
+ +

Examples

+ +
@font-face {
+  font-family: examplefont;
+  src: local(Example Font),
+       url('examplefont.woff') format("woff"),
+       url('examplefont.otf') format("opentype");
+}
+
+ +

Specifications

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('CSS3 Fonts', '#src-desc', 'src')}}{{Spec2('CSS3 Fonts')}}Initial definition
+ +

Browser compatibility

+ + + +

{{Compat("css.at-rules.font-face.src")}}

-- cgit v1.2.3-54-g00ecf