首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

@font-face.src

@font-facesrcCSS描述符指定包含字体数据的资源。@font-face规则必须是有效的。

它的值是一个优先级,逗号分隔的外部引用列表或本地安装的字体名称。当需要字体时,用户代理会迭代使用第一个引用列出的引用集,并可以成功激活该引用。包含无效数据或未找到本地字体的字体将被忽略,用户代理将加载列表中的下一个字体。

与CSS中的其他URL一样,URL可能是相对的,在这种情况下,它将相对于包含该@font-face规则的样式表的位置进行解析。对于SVG字体,URL指向包含SVG字体定义的文档中的元素。如果省略元素引用,则隐含对第一个定义字体的引用。同样,可以包含多个字体的字体容器格式只能加载给定@font-face规则的一种字体。片段标识符用于指示要加载的字体。如果容器格式缺少定义的片段标识符方案,则使用简单的基于1的索引方案(例如,第一字体的“字体集合#1”,第二字体的“字体集合#2”)。

Related at-rule

@font-face

初始值

n/a (required)

使用媒体

all

计算值

as specified

规范顺序

order of appearance in the formal grammar of the values

语法

代码语言:javascript
复制
/* <url> values */
src: url(https://somewebsite.com/?developer/section/1072044/path/to/font.woff); /* absolute URL */
src: url(?developer/section/1072044/path/to/font.woff);                         /* relative URL */
src: url(?developer/section/1072044/path/to/font.woff) format("woff");          /* explicit format */
src: url('?developer/section/1072044/path/to/font.woff');                       /* quoted URL */
src: url(?developer/section/1072044/path/to/svgfont.svg);               /* 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(?developer/section/1072044/path/to/font.svg) format("svg"),
    url(?developer/section/1072044/path/to/font.woff) format("woff"),
    url(?developer/section/1072044/path/to/font.otf) format("opentype");

取值

<url> [ format( <string># ) ]?指定由URL组成的外部参考,后跟可选提示,描述由该URL引用的字体资源的格式。格式提示包含一个逗号分隔的格式字符串列表,表示已知的字体格式。如果用户代理不支持指定的格式,则跳过下载字体资源。如果没有提供格式提示,则始终下载字体资源。<font-face-name>使用该local()函数指定本地安装的字体的名称,该函数唯一标识较大族中的单个字体。该名称可以选择性地用引号引起来。

形式语法

代码语言:javascript
复制
[ <url> format(<string>#)? | local(<family-name>) ]#where 
<family-name> = <string> | <custom-ident>+

实例

代码语言:javascript
复制
@font-face {
  font-family: examplefont;
  src: local(Example Font), url(?developer/section/1072044/&) format("woff"),
      url(?developer/section/1072044/&) format("opentype");
}

规范

Specification

Status

Comment

CSS Fonts Module Level 3The definition of 'src' in that specification.

Candidate Recommendation

Initial definition

浏览器兼容性

Feature

Chrome

Edge

Firefox (Gecko)

Internet Explorer

Opera

Safari

Basic support

4.0

12.0

3.5 (1.9.1)

6.0

9.0

3.1

WOFF

5.0

?

3.6 (1.9.2)

9.0

11.1

5.1

WOFF 2

36.0

?

35.0 (35.0)1

No support

26.0

No support

TrueType

4.0

?

3.5 (1.9.1)

9.0

10.0

3.1

OpenType

4.0

?

3.5 (1.9.1)

9.0

10.0

3.1

Embedded OpenType

No support

?

No support

6.0

No support

No support

SVG Font

4.0

?

No support2

No support

9.0

3.2

Feature

Android

Firefox Mobile (Gecko)

IE Mobile

Opera Mini

Opera Mobile

Safari Mobile

Basic support

2.2

1.0 (1.9.1)

10.0

No support

12.0

3.1

WOFF

?

?

?

?

?

?

WOFF 2

?

?

?

?

?

?

TrueType

?

?

?

?

?

?

OpenType

?

?

?

?

?

?

Embedded OpenType

?

?

?

?

?

?

SVG Font

?

?

?

?

?

?

扫码关注腾讯云开发者

领取腾讯云代金券

http://www.vxiaotou.com