What's New in CSS3 ?
Table of contents
- 1. Why Modules?
- 2. Module Overview
- 3. Module Descriptions and Related Information
- 3.1. Introduction
- 3.2. Syntax / grammar
- 3.3. Selectors
- 3.4. Values & units
- 3.5. Value assignment / cascade / inheritance
- 3.6. Box model / vertical
- 3.7. Positioning
- 3.8. Color / gamma / color profiles
- 3.9. Colors and Backgrounds
- 3.10. Line box model
- 3.11. Text
- 3.12. Fonts
- 3.13. Ruby
- 3.14. Generated content / markers
- 3.15. Replaced content
- 3.16. Paged media
- 3.17. User interface
- 3.18. WebFonts
- 3.19. ACSS
- 3.20. SMIL
- 3.21. Tables
- 3.22. Columns
- 3.23. SVG
- 3.24. Math
- 3.25. BECSS
- 3.26. Media queries
- 3.27. Test Suite
- 4. Appendices
- 5. Module template
<div class="MsoNormal" style="background:white;line-height:normal;margin:0 0 10pt;">3. Module Descriptions and Related Information</div><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.1. Introduction</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">This provides a general overview of the specification’s goals, as well as basic notes on how CSS works, acknowledgments, and so forth. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">1. About the CSS2 Specification </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">2. Introduction to CSS2 </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.2. Syntax / grammar</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">A way to attach arbitrary properties to a hierarchically structured document or other data structure, with the characteristic that it has built-in “forward-compatibility” (a.k.a. “extensibility”). </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">4. CSS2 syntax and basic data types </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">7. Media types </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Appendix D. The grammar of CSS2 </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Namespaces </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.3. Selectors</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">Describes the selectors of CSS3. Selectors are used to select elements in an HTML or XML document, in order to attach (style) properties to them. The draft includes the selectors of CSS1 and CSS2 and extends them with new proposals that allow, for example, elements to be selected based on whether they contain a certain word, or whether they are the only element of their kind. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">5. Selectors </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">6.4.3. Specificity of selectors </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Appendix D.1 Selectors’ grammar </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Namespaces </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.4. Values & units</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">Things which are applied to values. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">4.3. Values </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Dynamic properties </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.5. Value assignment / cascade / inheritance</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">How properties interact, and the core of how CSS operates. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">6. Assigning property values, Cascading, and Inheritance </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.6. Box model / vertical</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">The box model describes the basics of the normal text flow, including how to “float” blocks of text or images, but excluding columns, tables, and other advanced layouts; i.e., it describes how text and other objects are strung into lines, and lines into blocks (paragraphs), and how those blocks are put below each other or side by side with the help of margins and borders. It treats both horizontal text and vertical writing modes. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">8. Box model </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">9. Visual formatting model </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">10. Visual formatting model details </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">11. Visual effects </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Floating boxes to top/bottom of page </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.7. Positioning</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">This describes the process of placing an element someplace other than it would normally be in the normal flow of the document. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">8. Box model </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">9. Visual formatting model </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">10. Visual formatting model details </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">11. Visual effects </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Floating boxes to top/bottom of page </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.8. Color / gamma / color profiles</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">In general, basic color descriptions and color handling in multiple environments. The color profiles section describes how two properties can be attached to embedded images to specify their “color space,” which is the information a renderer needs to paint the right color for each pixel. It should do away with the annoying problem that images, especially GIF and JPEG, but sometimes also PNG, look different on a Mac than on a PC, or other platforms. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">14. Color </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">14.1 Foreground color: the ‘color’ property </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">14.3 Gamma correction </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Transparency </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Color profile for replaced elements </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.9. Colors and Backgrounds</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">A description of how element foregrounds and backgrounds are formatted. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">14.2. The background </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.10. Line box model</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">A description of the line box model for inline elements, and the inline content of block elements. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Inline model document </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.11. Text</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">Description of the handling of text in user agents. Includes bidi, vertical alignment, text decoration, line breaking, etc. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">16. Text </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Copy-fitting/auto-sizing/auto-spacing </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">“International layout” </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.12. Fonts</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">Description of the handling of fonts in user agents. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">15. Fonts </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.13. Ruby</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">A draft that contains proposals for new style properties for typographic traditions that have so far had little attention in CSS, such as vertical Japanese and Arabic. The CSS working group is cooperating with W3C’s Internationalization working group on this. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">The Internationalization CSS WD </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.14. Generated content / markers</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">A description of how content is generated and markers are displayed. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">12. Generated content, automatic numbering, and lists </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.15. Replaced content</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">A module explaining how replaced content is handled and what qualifies as replaced content. </div><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.16. Paged media</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">Extends the properties that CSS2 already had with new ones to control such things as running headers and footers, page numbers and print-style cross-references (“see page…”). </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">13. Paged media </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">The CSS3 Page WD </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Running headers and footers </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Cross-references </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Float : gutter-side/fore-edge-side </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Floating boxes to top/bottom of page </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.17. User interface</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">Contains features for styling some interactive, dynamic aspects of Web pages: the look of form elements in their various states, more cursors and colors to describe GUIs (graphical user interfaces) that blend well with the user’s desktop environment, and a proposal for “kiosk” mode. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">18. User interface </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">The UI/Forms WD </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Rendering objects for forms </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.18. WebFonts</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">Authors continue to clamor for “more control” over their pages, and the fonts used in presenting them. This module will attempt to provide a way to make fonts more Web-friendly. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">15. Fonts </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Appendix C. Implementation and performance notes for fonts </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Appendix G. Descriptor index </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.19. ACSS</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">An attempt to make styled content even more accessible. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">19. Aural style sheets </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Accessibility features of CSS </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.20. SMIL</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">An attempt to link CSS and SMIL together. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">SMIL 1.0 </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">SYMM </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.21. Tables</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">The tables module contains the properties to lay out boxes in rows and columns. It allows a designer to assign roles like “table,” “cell,” “row,” or “caption” to boxes and provides for various alignments and border styles. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">17. Tables </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.22. Columns</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">Proposes new properties to create flexible column layouts. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Multicolumn layout in CSS </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.23. SVG</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">A format that expresses shapes (lines, circles, splines, etc.) in an XML-based language and their style (fill color, stroke width, etc.) in CSS. This should make it easy to create text and graphics in the same style simply by using a single style sheet for both. SVG uses several existing CSS properties, but also introduces new ones that may or may not be useful for styling text. It will progress to Recommendation as a separate specification, but the (new) CSS properties are coordinated with the CSS working group. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">SVG </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.24. Math</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">An attempt to provide style properties for mathematical expressions. This will obviously be deeply linked to the MathML specification. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">MathML 1.0 </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.25. BECSS</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">A proposal to use the CSS syntax and CSS’s system of cascading and inheritance to attach “behavior” (rather than style) to elements. Behavior in this context refers to any dynamic changes to the style or the document in response to user events, such as clicks and key presses. The behaviors themselves are expressed as pieces of script, in languages such as ECMAscript. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">BECSS draft </li></ul><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.26. Media queries</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">To describe in more detail what type of devices a style sheet applies to, this document proposes media queries. A media query consists of a media type and one or more expressions to limit the scope of a certain style sheet. Among the proposed media features that can be used in expressions are “width”, “height” (size of the display), and “color” (color depth of the display). </div><div style="background:white;border-bottom:#9999cc 1pt dotted;border-left:medium none;border-right:medium none;border-top:#003399 1pt solid;padding:4pt 0 2pt;"><div class="MsoNormal" style="background:white;border-bottom:medium none;border-left:medium none;border-right:medium none;border-top:medium none;line-height:normal;margin:0 0 1.5pt;padding:0;">3.27. Test Suite</div></div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">Providing implementation guidelines, concrete examples, and user insight into implementation support, a test suite is crucial to the success of any specification. Although the Test Suite is a module in itself and has a module owner, individual module owners are responsible for assisting in the creation and review of tests for their specific module. </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">CSS1 Test Suite </li></ul><div class="MsoNormal" style="background:white;line-height:normal;margin:0 0 10pt;">4. Appendices</div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">Some appendices will be split up to go with individual modules. These are: </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Appendix B. Changes from CSS1 </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Appendix E. References </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Appendix F. Property index </li></ul><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">For example, the changes between one version of a module and another should be tracked in an appendix to that module, not a single appendix to the entire specification. Similarly, there should be a property reference for each module. There may be a single cumulative reference for the entire specification, although this is not yet known with any certainty. Each module should also include an appendix listing any dependencies on other modules or specifications. </div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">There will also be a few specification-wide appendices. There are projected to be: </div><ul type="disc"><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Appendix A. A sample style sheet for HTML 4.0 </li><li class="MsoNormal" style="color:black;line-height:normal;margin:0 0 10pt;text-align:justify;">Appendix H. Index </li></ul><div class="MsoNormal" style="background:white;line-height:normal;margin:0 0 10pt;">5. Module template</div><div class="MsoNormal" style="line-height:normal;margin:0 0 10pt;text-align:justify;">All modules should conform to the format defined in the CSS3 editing rules [member-only link]. In addition to the definitions of properties and values, each module contains a list of dependencies on other modules or specifications, and also provides a list of changes from CSS2.</div><div class="MsoNormal" style="margin:0 0 10pt;">
</div>