@@ -65,12 +65,12 @@ <h2 class="no-num no-toc" id="status">Status of this document</h2>
6565
6666<!--status-->
6767
68- < p > < strong > All features described in this specification that also
68+ < p > All features described in this specification that also
6969exist in CSS 2.1 [[!CSS21]] are intended to be backwards compatible.
7070In case of conflict between this draft and CSS 2.1 [[!CSS21]],
7171CSS 2.1 probably represents the intention of the CSS WG better
7272than this draft (other than on values and units that are new to
73- CSS3).</ strong >
73+ CSS3).
7474
7575< p > This is a draft of a < a href ="http://www.w3.org/TR/css3-roadmap/ "> module
7676of CSS level 3</ a > . It will probably be bundled with some other modules
@@ -164,7 +164,7 @@ <h3>Keywords</h3>
164164
165165< h3 > Numbers</ h3 >
166166
167- < p > Number values can either be integer or real numbers. Integer values
167+ < p > Number values can either be integer or real numbers Integer values
168168are denoted by < dfn > <integer></ dfn > and real number values are
169169denoted by < dfn > <number></ dfn > . Integers and real numbers are
170170specified in decimal notation only. An <integer> consists of one
@@ -174,47 +174,70 @@ <h3>Numbers</h3>
174174be preceded by a "-" or "+" to indicate the sign, and the sign
175175character is considered part of the <number> value.</ p >
176176
177- < p > Note that many properties that allow an integer or real number as a value
177+ < p > Many properties that allow an integer or real number as a value
178178actually restrict the value to some range. If the restriction is to a
179- non-negative value, then a non-negative number type is used.</ p >
180-
181-
182- < h3 > Non-negative numbers</ h3 >
179+ non-negative value, then a non-negative number type is used.
183180
184181< p > Non-negative number values can either be integer or real numbers.
185182Integer values are denoted by < dfn > <non-negative integer></ dfn >
186183and real number values are denoted by < dfn > <non-negative
187- number></ dfn > . Integers and real numbers are specified in decimal
188- notation only. A <non-negative-integer> consists of one or more
189- digits "0" to "9". A <non-negative-number> can either be an
190- <integer>, or it can be zero or more digits followed by a dot
191- (.) followed by one or more digits. Both non-negative integers and
192- non-negative real numbers may be preceded by a "+" to indicate the
193- sign, but this is not required and conveys no useful information.</ p >
184+ number></ dfn > . The syntax for non-negative numbers is the same as
185+ for other numbers execept that the "-" sign is not allowed.
194186
195- < h3 > Numbers with unit identifiers</ h3 >
196187
197- < h4 > Lengths</ h4 >
188+ < h3 > Lengths</ h3 >
198189
199- < p > Lengths refer to horizontal or vertical measurements.</ p >
190+ < p > Many CSS values consist of a number with a unit identifier. The
191+ most common types is lengths, but percentages, angles, times, and
192+ frequences also belong to this group.
200193
201- < p > The format of a length value (denoted by < dfn > <length> </ dfn > )
202- is a <number > immediately followed by a unit identifier (e.g.,
203- 'px', 'pt'). After the '0' length, the unit identifier is
204- optional.</ p >
194+ < p > Lengths refer to horizontal or vertical measurements. The format of
195+ a length value (denoted by < dfn > <length ></ dfn > ) is a
196+ <number> immediately followed by a unit identifier (e.g., 'px',
197+ 'pt'). After the '0' length, the unit identifier is optional.</ p >
205198
206- < p > Some properties < em > allow</ em > negative length values, but this may
199+ < p > Some properties allow negative length values, but this may
207200complicate the formatting and there may be implementation-specific
208201limits. If a negative length value is allowed but cannot be supported,
209202it should be converted to the nearest value that can be supported.</ p >
210203
211- < h4 > Relative length units</ h4 >
212-
213- < p id ="absrel-units "> There are two types of length units: relative and
214- absolute. < dfn > Relative length units</ dfn > specify a length relative to
215- another length property. Style sheets that use relative units will
204+ < p > There are several types of length units. Absolute l< dfn > Relative length units</ dfn > specify a length relative to
205+ other lengths. <!--Style sheets that use relative units will
216206more easily scale from one medium to another (e.g., from a computer
217- display to a laser printer).</ p >
207+ display to a laser printer).--> </ p >
208+
209+ < h3 > Absolute length units</ h3 >
210+
211+ < p > < dfn > Absolute length</ dfn > units are useful when the physical
212+ properties of the output medium are known. The absolute units are:</ p >
213+
214+ < table >
215+ < tr > < th > unit< th > definition
216+ < tr > < td > < span class ="css "> in</ span > < td > inches; 1 inch is equal to 2.54 centimeters.
217+ < tr > < td > < span class ="css "> cm</ span > < td > centimeters
218+ < tr > < td > < span class ="css "> mm</ span > < td > millimeters
219+ < tr > < td > < span class ="css "> pt</ span > < td > points; 1pt is equal to 1/72 inch.
220+ < tr > < td > < span class ="css "> pc</ span > < td > picas; 1 pica is equal to 12 points.
221+ </ table >
222+
<
57CD
/code>223+ < div class ="example ">
224+ < p style ="display:none "> Examples:</ p >
225+
226+ < pre >
227+ h1 { margin: 0.5in } /* inches */
228+ h2 { line-height: 3cm } /* centimeters */
229+ h3 { word-spacing: 4mm } /* millimeters */
230+ h4 { font-size: 12pt } /* points */
231+ h4 { font-size: 1pc } /* picas */</ pre >
232+ </ div >
233+
234+ < p > In cases where the specified length cannot be supported, user agents must
235+ approximate it in the actual value.</ p >
236+
237+
238+ < h3 > Relative length units</ h3 >
239+
240+ < p id ="absrel-units ">
218241
219242< p > Relative units are:</ p >
220243
@@ -224,7 +247,7 @@ <h4>Relative length units</h4>
224247< tr > < td > < span class ="css "> ex</ span > < td > the < em > x-height</ em > of the element's font
225248< tr > < td > < span class ="css "> px</ span < td > viewing device
226249<!--
227- <tr><td><span class="css">gd</span><td>the grid defined by <span class="property">'layout-grid'</span> described in the CSS3 Text module [[ !CSS3TEXT]]
250+ <tr><td><span class="css">gd</span><td>the grid defined by <span class="property">'layout-grid'</span> described in the CSS3 Text module !CSS3TEXT
228251-->
229252< tr > < td > < span class ="css "> rem</ span > < td > the font size of the root element
230253< tr > < td > < span class ="css "> vw</ span > < td > the viewport's width
@@ -234,6 +257,8 @@ <h4>Relative length units</h4>
234257</ table >
235258
236259
260+ < h4 > The 'em' unit</ h4 >
261+
237262< p > The < dfn title ="em (unit)|quad width "> 'em'</ dfn > unit is equal to
238263the computed value of the < span class ="property "> 'font-size'</ span >
239264property of the element on which it is used. The exception is when
@@ -270,6 +295,7 @@ <h4>Relative length units</h4>
270295</ pre >
271296</ div >
272297
298+ < h4 > The 'ex' unit</ h4 >
273299
274300< p > The < dfn title ="x-height|ex (unit) "> 'ex'</ dfn > unit is defined by the
275301font's x-height. The x-height is so called because it is often equal to the
@@ -281,6 +307,8 @@ <h4>Relative length units</h4>
281307property's < em > initial value</ em > .</ p >
282308
283309
310+ < h4 > The 'px' unit</ h4 >
311+
284312< p > The pixel unit, < dfn title ="pixel unit|px (pixel)::definition
285313of "> 'px'</ dfn > is relative to the resolution of the viewing device.
286314For example, the viewing device can be a computer display or a
@@ -370,15 +398,18 @@ <h4>Relative length units</h4>
370398inheritance, see the "Cascading and Inheritance" module.
371399-->
372400
401+ < h4 > The 're' unit</ h4 >
373402
374- < p > The < dfn title ="root em|em (grid)::definition of "> 'rem '</ dfn >
403+ < p > The < dfn title ="root em|em (grid)::definition of "> 're '</ dfn >
375404unit ('root em') is relative to the computed value of the < span
376405class ="property "> 'font-size'</ span > value of the root element. The
377- exception is when 'rem ' occurs in the value of the < span
406+ exception is when 're ' occurs in the value of the < span
378407class ="property "> 'font-size'</ span > property of the root element
379408itself, in which case it is relative to the 'medium' font-size. It may
380409be used for vertical or horizontal measurement.
381410
411+ < h4 > The 'vw' unit</ h4 >
412+
382413< p > The < dfn title ="vw::definition of "> 'vw'</ dfn > unit is relative to
383414the viewport's width. The viewport's width is equal to 100
384415'vw' units.
@@ -396,50 +427,32 @@ <h4>Relative length units</h4>
396427window is enlarged), lengths specifed in the 'vh' unit is scaled
397428propertionally.
398429
430+ < h4 > The 'vh' unit</ h4 >
431+
399432< p > The < dfn title ="vh::definition of "> 'vh'</ dfn > unit is relative to
400433the viewport's height. The viewport's width is equal to 100
401434'vh' units. When the height of the viewport is changed (for example,
402435when the browser window is enlarged), lengths specifed in the 'vh'
403436unit are scaled proportionally.
404437
438+ < h4 > The 'vm' unit</ h4 >
405439
406440< p > The < dfn title ="vm::definition of "> 'vm'</ dfn > unit is relative to
407441the viewport's height or width, whichever of the two is smaller.
408442The minimum of the viewport's width/height is equivalent to 100 'vm'
409443units. When the height or width of the viewport is changed, lengths
410444specified in the 'vm' unit are scaled proportionally.
411445
446+ < h3 > Fractions</ h3 >
412447
448+ < h4 > The 'fr' unit</ h4 >
413449
414- < h4 > Absolute length units</ h4 >
415-
416- < p id ="x41 "> < dfn > Absolute length</ dfn > units are useful when the physical
417- properties of the output medium are known. The absolute units are:</ p >
418-
419- < table >
420- < tr > < th > unit< th > definition
421- < tr > < td > < span class ="css "> in</ span > < td > inches; 1 inch is equal to 2.54 centimeters.
422- < tr > < td > < span class ="css "> cm</ span > < td > centimeters
423- < tr > < td > < span class ="css "> mm</ span > < td > millimeters
424- < tr > < td > < span class ="css "> pt</ span > < td > points; 1pt is equal to 1/72 inch.
425- < tr > < td > < span class ="css "> pc</ span > < td > picas; 1 pica is equal to 12 points.
426- </ table >
427-
428- < div class ="example ">
429- < p style ="display:none "> Examples:</ p >
450+ < h3 > Grids</ h3 >
430451
431- < pre >
432- h1 { margin: 0.5in } /* inches */
433- h2 { line-height: 3cm } /* centimeters */
434- h3 { word-spacing: 4mm } /* millimeters */
435- h4 { font-size: 12pt } /* points */
436- h4 { font-size: 1pc } /* picas */</ pre >
437- </ div >
452+ < h4 > The 'gr' unit</ h4 >
438453
439- < p > In cases where the specified length cannot be supported, user agents must
440- approximate it in the actual value.</ p >
441454
442- < h4 > Percentages</ h4 >
455+ < h3 > Percentages</ h3 >
443456
444457< p > The format of a percentage value (denoted by < dfn
445458title ="<percentage>::definition of "> <percentage></ dfn > in this
@@ -472,7 +485,7 @@ <h4>Percentages</h4>
472485
473486< p class ="issue "> Do we need a "non-negative percentage", e.g. for "font-size"?
474487
475- < h4 > Angles</ h4 >
488+ < h3 > Angles</ h3 >
476489
477490< p > Angle values (denoted by < dfn
478491title ="<angle>::definition of "> <angle></ dfn > in the text) are
@@ -496,9 +509,8 @@ <h4>Angles</h4>
496509'1.570796326794897rad'.</ p >
497510
498511
499- < h3 > Non-negative numbers with unit identifiers</ h3 >
500512
501- < h4 > Times</ h4 >
513+ < h3 > Times</ h3 >
502514
503515< p > Time values (denoted by < dfn
504516title ="<time>::definition of "> <time></ dfn > in the text) are used
@@ -513,8 +525,10 @@ <h4>Times</h4>
513525 < li > < dfn title ="s (seconds) "> s:</ dfn > seconds</ li >
514526</ ul >
515527
528+ < p > Time values are always positive.
516529
517- < h4 > Frequencies</ h4 >
530+
531+ < h3 > Frequencies</ h3 >
518532
519533< p > Frequency values (denoted by < dfn
520534title ="<frequency>::definition of "> <frequency></ dfn > in the text)
@@ -529,10 +543,12 @@ <h4>Frequencies</h4>
529543 < li > < dfn title ="kHz (kilohertz) "> kHz:</ dfn > kilohertz</ li >
530544</ ul >
531545
532-
533546< p > For example, 200Hz (or 200hz) is a bass sound, and 6kHz (or 6khz) is a
534547treble sound.</ p >
535548
549+ < p > Frequency values are always positive.
550+
551+
536552< h3 > Strings</ h3 >
537553
538554< p > < dfn title ="<string>, definition of "> Strings</ dfn > can either be
@@ -1203,7 +1219,7 @@ <h3><dfn>Actual values</dfn></h3>
12031219
12041220< h2 class ="no-num " id ="acknowledgments "> Acknowledgments</ h2 >
12051221
1206- < p > Comments and suggestions from Ian Hickson, David Baron, Edward Welbourne, Boris Zbarsky, Björn Höhrmann and Michael Day improved this module.
1222+ < p > Comments and suggestions from Alex Mogilevsky, Ian Hickson, David Baron, Edward Welbourne, Boris Zbarsky, Björn Höhrmann and Michael Day improved this module.
12071223
12081224<!--
12091225
0 commit comments