Skip to content

Commit 9f79498

Browse files
author
litherum
committed
[css-fonts-4] Migrate @font-face and 'font-family' descriptor from level 3
1 parent abc32db commit 9f79498

1 file changed

Lines changed: 114 additions & 0 deletions

File tree

css-fonts-4/Overview.bs

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1050,6 +1050,120 @@ at least as dark as its predecessor. Only values between 1 - 999 are valid, and
10501050

10511051
<h2 id="font-resources">Font Resources</h2>
10521052

1053+
<h3 id="font-face-rule">The <dfn id="at-font-face-rule" style="font-weight: inherit; font-style: inherit"><code>@font-face</code></dfn> rule</h3>
1054+
1055+
The <code>@font-face</code> rule allows for linking to fonts that are
1056+
automatically fetched and activated when needed. This allows authors to select
1057+
a font that closely matches the design goals for a given page
1058+
rather than limiting the font choice to a set of fonts available
1059+
on a given platform. A set of font descriptors define the location of a font
1060+
resource, either locally or externally, along with the style characteristics of
1061+
an individual face. Multiple <code>@font-face</code> rules can be used to construct
1062+
font families with a variety of faces. Using CSS font matching rules, a
1063+
user agent can selectively download only those faces that are needed for
1064+
a given piece of text.
1065+
1066+
The <code>@font-face</code> rule consists of the <code>@font-face</code> at-keyword followed
1067+
by a block of descriptor declarations. In terms of the grammar, this
1068+
specification defines the following productions:
1069+
1070+
<pre><dfn>font_face_rule</dfn>
1071+
: <i>FONT_FACE_SYM</i> <a href="https://www.w3.org/TR/CSS21/grammar.html#scanner"><i>S</i></a>* '{' <a href="https://www.w3.org/TR/CSS21/grammar.html#scanner"><i>S</i></a>* <i>descriptor_declaration</i>? [ ';' <a href="https://www.w3.org/TR/CSS21/grammar.html#scanner"><i>S</i></a>* <i>descriptor_declaration</i>? ]* '}' <a href="https://www.w3.org/TR/CSS21/grammar.html#scanner"><i>S</i></a>*
1072+
;
1073+
1074+
<dfn>descriptor_declaration</dfn>
1075+
: <a href="https://www.w3.org/TR/CSS21/grammar.html#grammar"><i>property</i></a> ':' <a href="https://www.w3.org/TR/CSS21/grammar.html#scanner"><i>S</i></a>* <a href="https://www.w3.org/TR/CSS21/grammar.html#grammar"><i>expr</i></a>
1076+
;</pre>
1077+
1078+
The following new definitions are introduced:
1079+
1080+
<pre>- -|\\0{0,4}2d(\r\n|[ \t\r\n\f])?
1081+
1082+
F f|\\0{0,4}(46|66)(\r\n|[ \t\r\n\f])?</pre>
1083+
1084+
The following new token is introduced:
1085+
1086+
@{F}{O}{N}{T}{-}{F}{A}{C}{E} {return <dfn>FONT_FACE_SYM</dfn>;}
1087+
1088+
Each <code>@font-face</code>
1089+
rule specifies a value for every font descriptor, either implicitly or
1090+
explicitly. Those not given explicit values in the rule take the initial
1091+
value listed with each descriptor in this specification. These
1092+
descriptors apply solely within the context of the <code>@font-face</code> rule in
1093+
which they are defined, and do not apply to document language elements.
1094+
There is no notion of which elements the descriptors apply to or whether
1095+
the values are inherited by child elements. When a given descriptor occurs
1096+
multiple times in a given <code>@font-face</code> rule, only the last
1097+
descriptor declaration is used and all prior declarations for that
1098+
descriptor are ignored.
1099+
1100+
<div class="example">
1101+
1102+
To use a downloadable font called Gentium:
1103+
1104+
<pre>
1105+
@font-face {
1106+
font-family: Gentium;
1107+
src: url(http://example.com/fonts/Gentium.woff);
1108+
}
1109+
1110+
p { font-family: Gentium, serif; }
1111+
</pre>
1112+
1113+
The user agent will download Gentium and use it when rendering text
1114+
within paragraph elements. If for some reason the site serving the font
1115+
is unavailable, the default serif font will be used.
1116+
</div>
1117+
1118+
A given set of <code>@font-face</code> rules define a set of fonts
1119+
available for use within the documents that contain these rules.
1120+
When font matching is done, fonts defined using these rules
1121+
are considered before other available fonts on a system.
1122+
1123+
Downloaded fonts are only available to documents that reference them.
1124+
The process of activating these fonts must not make them available to
1125+
other applications or to documents that don't directly link to the same
1126+
font. User agent implementers might consider it convenient to use
1127+
downloaded fonts when rendering characters in other documents for which no
1128+
other available font exists as part of the <em>system font fallback</em> procedure.
1129+
However, this would cause a security leak since the contents of one page would be
1130+
able to affect other pages, something an attacker could use as an attack
1131+
vector. These restrictions do not affect caching behavior, fonts are
1132+
cached the same way other web resources are cached.
1133+
1134+
This at-rule follows the forward-compatible parsing rules of CSS.
1135+
Like properties in a declaration block, declarations of any
1136+
descriptors that are not supported by the user agent must be ignored.
1137+
<code>@font-face</code> rules require a font-family and src
1138+
descriptor; if either of these are missing, the
1139+
<code>@font-face</code> rule is invalid and must be ignored
1140+
entirely.
1141+
1142+
In cases where user agents have limited platform resources or implement
1143+
the ability to disable downloadable font resources, <code>@font-face</code> rules must
1144+
simply be ignored; the behavior of individual descriptors as defined in this
1145+
specification should not be altered.
1146+
1147+
<h3 id="font-family-desc">Font family: the <a href="#descdef-font-family">font-family</a> descriptor</h3>
1148+
1149+
<pre class='descdef mq'>
1150+
Name: font-family
1151+
Value: <<family-name>>
1152+
For: @font-face
1153+
Initial: N/A
1154+
</pre>
1155+
1156+
This descriptor defines the font family name that will be used in
1157+
all CSS font family name matching. It is required for the <code>@font-face</code>
1158+
rule to be valid. It overrides the font family names contained in the
1159+
underlying font data. If the font family name is the same as a font
1160+
family available in a given user's environment, it effectively hides
1161+
the underlying font for documents that use the stylesheet. This
1162+
permits a web author to freely choose font-family names without
1163+
worrying about conflicts with font family names present in a given
1164+
user's environment. Likewise, platform substitutions for a given font
1165+
family name must not be used.
1166+
10531167
<h3 id="src-desc">Font reference: the 'src' descriptor</h3>
10541168

10551169
<pre class='descdef mq'>

0 commit comments

Comments
 (0)