aboutsummaryrefslogtreecommitdiff
path: root/files/zh-cn/web/api/fontfaceset/index.html
blob: 564cd391ea21843eee070379b0558cd311601b45 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
---
title: FontFaceSet
slug: Web/API/FontFaceSet
tags:
  - API
  - Fonts
translation_of: Web/API/FontFaceSet
---
<div>{{APIRef("CSS Font Loading API")}}{{SeeCompatTable}}</div>

<p><a href="/en-US/docs/Web/API/CSS_Font_Loading_API">CSS 字体加载 API</a><strong><code>FontFaceSet</code></strong> 管理着字体们的加载和可查询的字体们下载状态。</p>

<h2 id="Properties">Properties</h2>

<dl>
 <dt>{{domxref("FontFaceSet.status")}} {{readonlyinline}}</dt>
 <dd>表示 font-face's 的加载状态,可能是 <code>'loading'</code><code>'loaded'</code></dd>
</dl>

<h2 id="Events">Events</h2>

<dl>
</dl>

<dl>
 <dt>{{domxref("FontFaceSet.onloading")}}</dt>
 <dd>{{event("loading")}}相关事件发生时触发{{domxref("EventListener")}} ,表示 font-face 集已经开始加载了。</dd>
 <dt>{{domxref("FontFaceSet.onloadingdone")}}</dt>
 <dd>{{event("loading")}}相关事件发生时触发{{domxref("EventListener")}} ,表示 font-face 集已经完成加载了。</dd>
 <dt>{{domxref("FontFaceSet.onloadingerror")}}</dt>
 <dd>{{event("loading")}}相关事件发生时触发{{domxref("EventListener")}} ,表示 font-face 集加载时产生了一个错误。</dd>
</dl>

<h2 id="Methods">Methods</h2>

<dl>
 <dt>{{domxref("FontFaceSet.add","FontFaceSet.add()")}}</dt>
 <dd>向字体集添加一个字体。</dd>
 <dt>{{domxref("FontFaceSet.check","FontFaceSet.check()")}}</dt>
 <dd>一个{{domxref("Boolean")}} 用于表示一个字体是否加载完成,但它不回初始化你的加载。</dd>
 <dt>{{domxref("FontFaceSet.clear", "FontFaceSet.clear()")}}</dt>
 <dd>移除字体集的所有字体。</dd>
 <dt>{{domxref("FontFaceSet.delete","FontFaceSet.delete()")}}</dt>
 <dd>从字体集中移除一个字体。</dd>
 <dt>{{domxref("FontFaceSet.load","FontFaceSet.load()")}}</dt>
 <dd>返回解析为请求的字体的列表的 {{jsxref("Promise")}}</dd>
 <dt>{{domxref("FontFaceSet.ready", "FontFaceSet.ready()")}}</dt>
 <dd>准备操作已完成且开始解析字体时返回一个 {{jsxref("Promise")}}</dd>
</dl>

<h2 id="Specifications">Specifications</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('CSS3 Font Loading','#FontFaceSet-interface','FontFaceSet')}}</td>
   <td>{{Spec2('CSS3 Font Loading')}}</td>
   <td>Initial definition</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility">Browser compatibility</h2>

<div>{{CompatibilityTable}}</div>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatChrome(35.0)}}</td>
   <td>{{CompatGeckoDesktop(41)}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatSafari(10)}}</td>
  </tr>
  <tr>
   <td>clear() method</td>
   <td>{{CompatChrome(48.0)}}</td>
   <td> </td>
   <td> </td>
   <td> </td>
   <td> </td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Android Webview</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>Firefox OS</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
   <th>Chrome for Android</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatChrome(35.0)}}</td>
   <td>{{CompatGeckoMobile(41)}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatSafari(10)}}</td>
   <td>{{CompatChrome(35.0)}}</td>
  </tr>
  <tr>
   <td>clear() method</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatChrome(48.0)}}</td>
   <td> </td>
   <td> </td>
   <td> </td>
   <td> </td>
   <td> </td>
   <td>{{CompatChrome(48.0)}}</td>
  </tr>
 </tbody>
</table>
</div>

<p> </p>