Skip to content

Commit 4f6ea04

Browse files
committed
[css-fonts-5] Start level 5 as CSSWG resolved to put stuff there today #126
1 parent f04df64 commit 4f6ea04

File tree

1 file changed

+293
-0
lines changed

1 file changed

+293
-0
lines changed

css-fonts-5/Overview.bs

+293
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,293 @@
1+
<pre class='metadata'>
2+
Title: CSS Fonts Module Level 5
3+
Shortname: css-fonts
4+
Level: 5
5+
Status: ED
6+
Work Status: exploring
7+
Group: CSSWG
8+
ED: https://drafts.csswg.org/css-fonts-5/
9+
TR: https://www.w3.org/TR/css-fonts-5/
10+
!Delta Spec: yes
11+
Editor: Myles C. Maxfield, Apple Inc., mmaxfield@apple.com, w3cid 77180
12+
Editor: Chris Lilley, W3C, http://svgees.us, w3cid 1438
13+
Abstract: This specification defines modifications to the existing <a href="https://drafts.csswg.org/css-fonts-4/">CSS Fonts 4</a> specification along with additional features.
14+
Repository: w3c/csswg-drafts
15+
Inline Github Issues: title
16+
Default Highlight: css
17+
Warning: Not Ready
18+
</pre>
19+
20+
<pre class="link-defaults">
21+
spec:css-color-4; type:property; text:color
22+
spec:css-values; type:value; text:ex
23+
spec:css22; type:value; for:/; text:block
24+
spec:html; type:element; text:font
25+
spec:css-fonts-4; type:descriptor; text:font-language-override
26+
</pre>
27+
28+
29+
<h2 id="introduction">
30+
Introduction</h2>
31+
32+
The CSS Fonts Level 4 specification ([[!CSS-FONTS-4]]) describes the
33+
controls CSS provides for selecting and using fonts within documents,
34+
including support for variable fonts and color fonts.
35+
The ideas here are additions or modifications to the properties and
36+
rules defined in CSS Fonts Level 4.
37+
38+
This specification is currently a delta to the CSS Fonts Level 4 specification.
39+
Do not assume that if something is not here, it has been dropped.
40+
41+
42+
43+
<h3 id="values">
44+
Value Definitions</h3>
45+
46+
This specification follows the <a href="https://www.w3.org/TR/CSS2/about.html#property-defs">CSS property definition conventions</a> from [[!CSS2]]
47+
using the <a href="https://www.w3.org/TR/css-values-3/#value-defs">value definition syntax</a> from [[!CSS-VALUES-3]].
48+
Value types not defined in this specification are defined in CSS Values &amp; Units [[!CSS-VALUES-3]].
49+
Combination with other CSS modules may expand the definitions of these value types.
50+
51+
In addition to the property-specific values listed in their definitions,
52+
all properties defined in this specification
53+
also accept the <a>CSS-wide keywords</a> as their property value.
54+
For readability they have not been repeated explicitly.
55+
56+
<h2 id="basic-font-props">
57+
Basic Font Properties</h2>
58+
59+
<h3 id="font-family-prop">
60+
Font family: the 'font-family!!property' property</h3>
61+
62+
<h4 id="generic-font-families">
63+
Generic font families</h4>
64+
65+
In addition to the [[css-fonts-4#generic-font-families]]
66+
in CSS Fonts Level 4, the following new generic font families are also defined.
67+
68+
Issue(4910):
69+
70+
Issue(5054):
71+
72+
<dl dfn-for="font-family,<generic-family>" dfn-type=value>
73+
<dt id="xxx-def"><dfn>xxx</dfn>
74+
<dd>
75+
Placeholder text for the xxx generic font family.
76+
77+
78+
</dl>
79+
80+
Issue(4566):
81+
82+
<h3 id="font-weight-prop">Font weight: the 'font-weight!!property' property</h3>
83+
84+
Issue(2690):
85+
86+
87+
<h3 id="font-style-prop">
88+
Font style: the 'font-style!!property' property</h3>
89+
90+
Issue(4044):
91+
92+
93+
<h3 id="font-size-adjust-prop">
94+
Relative sizing: the 'font-size-adjust' property</h3>
95+
96+
Issue(5539):
97+
98+
99+
<h2 id="font-resources">
100+
Font Resources</h2>
101+
102+
<h3 id="font-face-rule">
103+
The <dfn id="at-font-face-rule">''@font-face''</dfn> rule</h3>
104+
105+
Issue(5518):
106+
107+
108+
<h3 id="font-size-desc">
109+
Font property descriptors: the 'font-size!!descriptor'
110+
</h3>
111+
112+
Issue(806):
113+
114+
Issue(731):
115+
116+
Issue(5892):
117+
118+
119+
<!-- should this stay in Fonts 4 or be here in Fonts 5? -->
120+
121+
<h3 id="font-metrics-override-desc">
122+
Default font metrics overriding:
123+
the 'ascent-override', 'descent-override' and 'line-gap-override' descriptors</h3>
124+
125+
<pre class='descdef'>
126+
Name: ascent-override
127+
Value: normal | <<percentage>>
128+
For: @font-face
129+
Initial: normal
130+
</pre>
131+
132+
<pre class='descdef'>
133+
Name: descent-override
134+
Value: normal | <<percentage>>
135+
For: @font-face
136+
Initial: normal
137+
</pre>
138+
139+
<pre class='descdef'>
140+
Name: line-gap-override
141+
Value: normal | <<percentage>>
142+
For: @font-face
143+
Initial: normal
144+
</pre>
145+
146+
The 'ascent-override', 'descent-override' and 'line-gap-override' descriptors define the
147+
<a spec="CSS-INLINE-3">ascent metric</a>, <a spec="CSS-INLINE-3">descent metric</a> and
148+
<a spec="CSS-INLINE-3">line gap metric</a> of the font, respectively.
149+
150+
When the descriptor value is 'normal', the corresponding metric value is obtained from the
151+
font file directly.
152+
153+
Note: User agents may draw data from different places from the font file as the metric values,
154+
which results in different text layouts.
155+
156+
When the descriptor value is a percentage, the corresponding metric value is resolved as the
157+
given percentage multiplied by the used font size. Negative values are invalid at parse time.
158+
159+
<div class="example">
160+
The percentage is resolved against different font sizes for different elements.
161+
162+
<pre>
163+
@font-face {
164+
font-family: overridden-font;
165+
ascent-override: 50%;
166+
...
167+
}
168+
169+
&lt;span style="font-family: overridden-font; font-size: 20px;"&gt;
170+
Outer span content
171+
&lt;span style="font-size: 150%;"&gt;Inner span content&lt;/span&gt;
172+
&lt;/span&gt;
173+
</pre>
174+
175+
The outer span uses an <a spec="CSS-INLINE-3" lt="ascent metric">ascent</a> value of
176+
10px, whereas the inner span uses 15px.
177+
178+
</div>
179+
180+
<div class="example">
181+
We may override the metrics of a local fallback font to match the primary font, which
182+
is a web font. This reduces layout shifting when switching from fallback to the
183+
primary font.
184+
185+
<pre>
186+
@font-face {
187+
font-family: cool-web-font;
188+
src: url("https://example.com/font.woff");
189+
}
190+
191+
@font-face {
192+
font-family: fallback-to-local;
193+
src: local(Some Local Font);
194+
/* Override metric values to match cool-web-font */
195+
ascent-override: 125%;
196+
descent-override: 25%;
197+
line-gap-override: 0%;
198+
}
199+
200+
&lt;div style="font-family: cool-web-font, fallback-to-local"&gt;Title goes here&lt;/div&gt;
201+
&lt;img src="https://example.com/largeimage" alt="A large image that you don't want to shift"&gt;
202+
</pre>
203+
204+
The image will not be vertically shifted when the user agent finishes loading and
205+
switches to use the web font.
206+
207+
</div>
208+
209+
<h3 id="font-sup-sub-override-desc">
210+
Default font metrics overriding:
211+
the 'superscript-position-override', 'subscript-position-override','superscript-size-override' and 'subscript-size-override' descriptors</h3>
212+
213+
Issue(5518):
214+
215+
<pre class='descdef'>
216+
Name: superscript-position-override
217+
Value: normal | <<percentage>>
218+
For: @font-face
219+
Initial: normal
220+
</pre>
221+
222+
<pre class='descdef'>
223+
Name: subscript-position-override
224+
Value: normal | <<percentage>>
225+
For: @font-face
226+
Initial: normal
227+
</pre>
228+
229+
<pre class='descdef'>
230+
Name: superscript-size-override
231+
Value: normal | <<percentage>>
232+
For: @font-face
233+
Initial: normal
234+
</pre>
235+
236+
<pre class='descdef'>
237+
Name: subscript-size-override
238+
Value: normal | <<percentage>>
239+
For: @font-face
240+
Initial: normal
241+
</pre>
242+
243+
244+
245+
<h2 id="font-rend-props">
246+
Font Feature Properties</h2>
247+
248+
249+
<h3 id="font-language-override-prop">Font language override: the 'font-language-override' property</h3>
250+
251+
Issue(5484):
252+
253+
254+
<h2 id="font-feature-variation-resolution">
255+
Font Feature and Variation Resolution</h3>
256+
257+
Issue(5635):
258+
259+
260+
<h2 id="font-variation-props">
261+
Font Variation Properties</h2>
262+
263+
264+
<h3 id="font-optical-sizing-def">
265+
Optical sizing control: the 'font-optical-sizing' property</h3>
266+
267+
Issue(5466):
268+
269+
270+
<!-- This might get moved here -->
271+
<!--
272+
<h2 id="color-font-support">
273+
Color Font Support</h2>
274+
-->
275+
276+
277+
<h2 id="priv-sec">
278+
Security and Privacy Considerations
279+
</h2>
280+
281+
No new security or privacy considerations have been raised on this specification.
282+
283+
284+
<h2 id="acknowledgments">
285+
Acknowledgments</h2>
286+
287+
The CSS Working group would like to thank:
288+
289+
290+
<h2 id="changes">
291+
Changes
292+
</h2>
293+
-->

0 commit comments

Comments
 (0)