WD-css2-19980128
Cascading Style Sheets, level 2
W3C Working Draft 28-Jan-1998
- This version:
- http://www.w3.org/TR/1998/WD-css2-19980128
- Latest version:
- http://www.w3.org/TR/WD-css2
- Previous version:
- http://www.w3.org/TR/WD-CSS2-971104
- Editors:
- Bert Bos
<bbos@w3.org>
Håkon Wium Lie
<howcome@w3.org>
Chris Lilley
<chris@w3.org>
Ian Jacobs
<ij@w3.org>
Abstract
This specification defines Cascading Style Sheet, level 2
(CSS2). CSS2 is a style sheet language that allows authors and users
to attach style (e.g. fonts, spacing and aural cues) to structured
documents (e.g. HTML and XML). The CSS2 language is human readable and
writable, and expresses style in common desktop publishing
terminology.
CSS2 builds on [CSS1], specified in http://www.w3.org/TR/REC-CSS1-961217.
All valid CSS1 style sheets are valid CSS2 style sheets.
Status of this document
This is a W3C Working Draft for review by W3C
members and other interested parties. It is a draft document and may
be updated, replaced or obsoleted by other documents at any time. It
is inappropriate to use W3C Working Drafts as reference material or to
cite them as other than "work in progress". This is work in progress
and does not imply endorsement by, or the consensus of, either W3C or
members of the CSS working group.
This document has been produced as part of the W3C Style
Activity, and is intended as a draft of a proposed recommendation
for CSS2.
If you did not get this document directly from the W3C website you may
want to check whether you have the latest version of this document by
looking at the list of W3C technical reports at <http://www.w3.org/TR/>.
Available formats
The CSS2 specification is also available in the following formats:
- a plain text file:
- http://www.w3.org/TR/1998/WD-css2-19980128/css20.txt,
- HTML as a gzip'ed tar file:
- http://www.w3.org/TR/1998/WD-css2-19980128/css20.tgz,
- HTML as a zip file (this is a '.zip' file not an '.exe'):
- http://www.w3.org/TR/1998/WD-css2-19980128/css20.zip,
- as well as a postscript file:
- http://www.w3.org/TR/1998/WD-css2-19980128/css20.ps,
- and a PDF file:
- http://www.w3.org/TR/1998/WD-css2-19980128/css20.pdf.
In case of a discrepancy between electronic and printed forms
of the specification, the electronic version is considered the
definitive version.
Available languages
The English version of this specification is the only normative
version. However, for translations in other languages see http://www.w3.org/TR/1998/WD-css2-19980128/translations.html.
Comments
Please send detailed comments on this document to the editors. We cannot guarantee a
personal response but we will try when it is appropriate. Public
discussion on CSS features takes place on www-style@w3.org and messages are
archived at http://lists.w3.org/Archives/Public/www-style/.
- About the CSS2 Specification
- Reading the specification
- How the specification is organized
- Conventions
- Document language elements
and attributes
- CSS property definitions
- Shorthand properties
- Notes and examples
Acknowledgments
Copyright Notice
Introduction to CSS2
- A brief CSS2 tutorial for HTML
- A brief CSS2 tutorial for XML
- The CSS2 processing model
- The canvas
- CSS2 addressing model
CSS design principles
Conformance: Requirements and Recommendations
- Definitions
- Conformance
- Error conditions
CSS2 syntax and basic data types
- Syntax
- Tokenization
- Characters and case
- Statements
- At-rules
- Blocks
- Rule sets, declaration blocks, and selectors
- Declarations and properties
- Comments
Rules for handling parsing
errors
Values
- Integers and real numbers
- Lengths
- Percentages
- URIs
- Colors
- Angles
- Times
- Frequencies
- Strings
CSS embedded in HTML
CSS as a stand-alone file
Character escapes in CSS
Selectors
- Pattern matching
- Universal selector
- Type selectors
- Descendant selectors
- Child selectors
- :first-child pseudo-class
- Adjacent selectors
- Attribute selectors
- Matching attributes and attribute values
- Reusing the value of an attribute
- The "class" attribute in HTML
ID selectors
Grouping
Pseudo-elements and pseudo-classes
- The :first-line pseudo-element
- The :first-letter pseudo-element
- The :before and :after
pseudo-elements
- Pseudo-elements with descendant selectors
- The Anchor pseudo-classes:
:link,
:visited,
:hover, and
:active
- Combining pseudo-elements with attribute selectors
Assigning property values, Cascading, and Inheritance
- Specified, computed, and absolute values
- Specified values
- Computed values
- Actual values
Inheritance
- The inherit
value
The cascade
- Cascading order
- 'Important' rules
- Cascading order in HTML
- Precedence of non-CSS presentational hints
Media types
- Introduction to media types
- Specifying media-dependent style sheets
- The @media rule
- The media-dependent @import rule
Recognized media types
- Media groups
Visual rendering model
- Introduction to the visual rendering model
- The viewport
- The box model
- Controlling box generation: the 'display' property
- Compact and run-in boxes
- Box dimensions
- Example of margins, padding, and borders
Positioning schemes
- Choosing a positioning scheme: 'position' property
- Box offsets: 'top', 'right', 'bottom', 'left'
Normal flow
- Anonymous boxes
- Block formatting context
- Inline formatting context
- Direction of inline flow: the 'direction' property
- Relative positioning
Floats: the 'float' and 'clear' properties
- Controlling flow next to floats
Absolute positioning
- Fixed positioning
Relationships between 'display', 'position', and 'float'
Comparison of normal, relative, floating, absolute positioning
- Normal flow
- Relative positioning
- Floating a box
- Absolute positioning
Z-order: Layered presentation
- Specifying the stack level: the 'z-index' property
Visual rendering model details
- Margin, border, and padding properties
- Margin properties:
'margin-top',
'margin-right',
'margin-bottom',
'margin-left', and
'margin'
- Padding properties:
'padding-top',
'padding-right',
'padding-bottom',
'padding-left', and
'padding'
- Border properties
- Border width: 'border-top-width', 'border-right-width', 'border-bottom-width',
'border-left-width', and
'border-width'
- Border color:
'border-top-color',
'border-right-color',
'border-bottom-color',
'border-left-color', and
'border-color'
- Border style:
'border-top-style',
'border-right-style',
'border-bottom-style',
'border-left-style', and
'border-style'
- Border shorthand properties:
'border-top',
'border-bottom',
'border-right',
'border-left', and
'border'
Containing blocks
Box width calculations
- Content width: the 'width' property
- Widths of boxes in the normal flow and
floated boxes
- Determining the content width
- Computing margin widths
Width of absolutely positioned elements
Minimum and maximum widths: 'min-width' and 'max-width'
Box height calculations
- Content height: the 'height' property
- Determining the content height
- Height of absolutely positioned elements
- Minimum and maximum heights: 'min-height' and 'max-height'
Collapsing margins
Line height calculations: the 'line-height' and 'vertical-align'
properties
- Leading and half-leading
Floating constraints
Visual effects
- Overflow and clipping
- Overflow: the 'overflow' property
- Clipping: the 'clip' property
Visibility: the 'visibility' property
Generated content and automatic numbering
- The :before and :after
pseudo elements and the 'content' property
- Automatic counters and numbering
Paged media
- Introduction to paged media
- Page boxes: the @page rule
- Page margins
- Page size: the 'size' property
- Rendering page boxes that do not fit a target sheet
- Positioning the page box on the sheet
- Crop marks: the 'marks' property
- Left, right, and first pages
- Content outside the page box
Page breaks
- Page break properties: 'page-break-before',
'page-break-after',
'orphans', and
'widows'
- Allowed page breaks
- Forced page breaks
- "Best" page breaks
Cascading in the page context
Colors and Backgrounds
- Foreground color: the 'color' property
- The background
- Background properties: 'background-color', 'background-image', 'background-repeat', 'background-attachment',
'background-position', and
'background'
Fonts
- Introduction
- Font specification
- Font specification properties
- Font family: the 'font-family'
- Font style: the
'font-style',
'font-variant', and
'font-weight' properties
- Font size: the 'font-size'
and 'font-size-adjust'
properties
- Shorthand font property: the 'font' property
- Generic font families
- serif
- sans-serif
- cursive
- fantasy
- monospace
Font selection
- Font Descriptions and @font-face
- Descriptors for Selecting a Font:
'font-family',
'font-style',
'font-variant',
'font-weight', and
'font-size'
- Descriptors for Font Data Qualification: 'unicode-range'
- Descriptor for Numeric Values: 'units-per-em'
- Descriptor for Referencing: 'src'
- Descriptors for Matching: 'panose-1',
'stemv',
'stemh',
'slope',
'cap-height',
'x-height',
'ascent', and
'descent'
- Descriptors for Synthesis: 'widths' and 'definition-src'
- Descriptors for Alignment:
'baseline',
'centerline',
'mathline',
and 'topline'
Font Characteristics
- Introducing Font Characteristics
- Adorned font name
- Central Baseline
- Co-ordinate units on the em square
- Font encoding tables
- Font family name
- Glyph Representation widths
- Horizontal stem width
- Height of capital glyph representations
- Height of lowercase glyph representations
- Lower Baseline
- Mathematical Baseline
- Maximal bounding box
- Maximum unaccented height
- Maximum unaccented depth
- Panose-1 number
- Range of ISO10646characters
- Top Baseline
- Vertical stem width
- Vertical stroke angle
Font matching algorithm
- Examples of font matching
Text
- Indentation: the 'text-indent' property
- Alignment the 'text-align' property
- Decoration
- Underlining, over lining, striking, and
blinking: the 'text-decoration'
property
- Text shadows: the 'text-shadow' property
Letter and word spacing: the 'letter-spacing' and 'word-spacing' properties
Case
- Capitalization: the 'text-transform' property
- Special first letter/first line
White space: the 'white-space' property
Text in HTML
- Forcing a line break
Lists
- Visual formatting of lists
- List properties: 'list-style-type', 'list-style-image', 'list-style-position',
and 'list-style'
Tables
- Building visual tables
- The 'display' property
- Cell spanning properties: 'column-span', and
'row-span'
Layout model of elements inside tables
- Margins on rows, columns and cells
- Interactions between rows and columns
- Labeled diagram:
- The 'border-collapse' property
- The border styles
Computing widths and heights
- The 'table-layout' property
- The 'collapse' value for the 'visibility' property
'Vertical-align' on table cells
Table elements in selectors
- Columns and cell selectors
- Row, column and cell pseudo-classes
- Row pseudo-classes:
- Column pseudo-classes:
HTML 4.0 default table stylesheet
UNDER CONSTRUCTION!
-material yet to be integrated, substituted, or discarded
- Table layout
- Computing widths and heights
- Placement of the borders: 'cell-spacing'
- Conflict resolution for borders
- Properties for columns and rows
- Vertical alignment of cells in a row
- Horizontal alignment of cells in a column
- Table captions: the 'caption-side' property
- Generating speech: the property
- Table implementation notes
User interface
- Cursors: the 'cursor' property
- User preferences for colors
- User preferences for fonts
- Other rendering issues that depend on user agents
- Magnification
Aural style sheets
- Introduction to aural style sheets
- Volume properties: 'volume'
- Speaking properties: 'speak'
- Pause properties: 'pause-before', 'pause-after', and 'pause'
- Cue properties: 'cue-before', 'cue-after', and 'cue'
- Mixing properties: 'play-during'
- Spatial properties: 'azimuth' and
'elevation'
- Voice characteristic properties: 'speech-rate', 'voice-family',
'pitch',
'pitch-range',
'stress', and
'richness'
- Speech properties:
'speak-punctuation',
'speak-date',
'speak-numeral', and
'speak-time'
- Appendix A: A sample style sheet for HTML 4.0
- Appendix B: Changes from CSS1
- New functionality
- Updated descriptions
- Changes
Appendix C: Implementation and performance
notes
- Order of property value calculation
- Colors
- Gamma Correction
- Fonts
- Glossary of font terms
- Font retrieval
- Meaning of the Panose Digits
- Deducing Unicode Ranges for TrueType
Appendix D: The grammar of CSS2
- Grammar
- Lexical scanner
Property index
Descriptor index
Index