# HG changeset patch # Parent 318ab08c117dda7d531a621c11f81a8741c15280 Reorganize intro section: - replace Dependencies with Module Interactions - Shift really great introductory paragraph from Values section into Intro section - Import Value Syntax Definition section from CSS2.1 diff --git a/Overview.src.html b/Overview.src.html --- a/Overview.src.html +++ b/Overview.src.html @@ -12,6 +12,10 @@ tt.declaration { white-space: nowrap } .del { text-decoration: line-through} .say { font-style: italic } + .value { font: inherit; white-space: pre-wrap; margin: 0; padding: 0; } + #propvalues td { text-align: right; } + #propvalues td + td { text-align: left; } + p { text-indent: 0 !important; margin: 1em 0 !important; } @@ -82,36 +86,131 @@ Recommendation.

Dependencies on other modules

- -

This CSS3 module depends on the following other CSS3 modules:

- -

Cascading and Inheritance [[!CSS3CASCADE]], which describes how to find the - resulting value from several competing values. Also, it describes how - to replace the "inherit" keyword with the inherited value.
Syntax [[!CSS3SYN]], which describes the syntax of values at the - lexical level.
Color [[!CSS3COLOR]], which defines additional values used for some properties that control color of text, borders, etc
Fonts [[!CSS3FONT]], which describes additional values used for font-related properties

- -

Introduction

By setting property values on elements in a document, style sheets -express the appearance of the document. In order to express rich -designs, a wide range of values and associated units are necessary. -This specification describes the various types of values and units that -can be used in CSS style sheets. +

The value definition field of each CSS property can contain keywords, + data types (which appear between ''<'' and ''>''), and information on how + they can be combined. + Generic data types (<length> being the most widely used) + that can be used by many properties are described in this specification, + while more specific data types (e.g., <border-width>) + are described in the corresponding modules. +

+Module Interactions

Value definitions

This module replaces and extends the data type definitions in [[!CSS21]] + sections + 1.4.2.1, + 4.3, + and A.2. -

Each CSS property has a value definition field in the property description. -The value definition describes what types of values the property accepts. The -syntax used in the value definitions field is defined in [[!CSS3SYN]]. +

+Value Definition Syntax

The syntax described here is used to define the set of valid values + for CSS properties. A property value can have one or more components. + +

+Component value types

+ +

Component value types are designated in several ways: + +

keyword values (such as ''auto'', ''disc'', etc.), + which appear literally, without quotes (e.g. auto) + +
basic data types, which appear between ''<'' and ''>'' + (e.g., <length>, <percentage>, etc.). + +
types that have the same range of values as a property bearing + the same name + (e.g., <'border-width'> <'background-attachment'>, etc.). + In this case, the type name is the property name (complete with quotes) + between the brackets. Such a type does not + include the value 'inherit'. + +
non-terminals that do not share the same name as a property. In this + case, the non-terminal name appears between ''<'' and ''>'', as in + <spacing>. Notice the distinction between + <border-width> and <'border-width'>: + the latter is defined as the value of the 'border-width' property, + the former requires an explicit expansion elsewhere. + The definition of a non-terminal is located near its first appearance + in the specification. +

+ +

Some property value definitions also include the slash (/) and/or the + comma (,) as literals. These represent their corresponding tokens. + +

+Component value combinators

+ +

Component values can be arranged into property values as follows: + +

Several juxtaposed words mean that all of them must occur, in the + given order. +
A double ampersand (&&) separates two or more components, + all of which must occur, in any order. +
A double bar (||) separates two or more options: + one or more of them must occur, in any order. +
A bar (|) separates two or more alternatives: + exactly one of them must occur. +
Brackets ([ ]) are for grouping. +

+ +

Juxtaposition is stronger than the double ampersand, the double + ampersand is stronger than the double bar, and the double bar + is stronger than the bar. Thus, the following lines are equivalent: +

+  a b   |   c ||   d &&   e f
+[ a b ] | [ c || [ d && [ e f ]]]

+ +

+Component value multipliers

+ +

Every type, keyword, or bracketed group may be followed by one of + the following modifiers:

+ +

An asterisk (*) indicates that the preceding type, word, or + group occurs zero or more times. + +
A plus (+) indicates that the preceding type, word, or group + occurs one or more times. + +
A question mark (?) indicates that the preceding type, word, or + group is optional. + +
A pair of numbers in curly braces ({A,B}) + indicates that the preceding type, word, or group occurs at least + A and at most B times. +

+ +

+Component values and white space

+ +

Component values are specified in terms of tokens, as described in Chapter 4 + of [[!CSS21]]. + As the grammar allows spaces between tokens in the components of the + value production, spaces may appear between tokens in + property values. + +

Note: In many cases, spaces will in fact be + required between tokens in order to distinguish them from + each other. For example, the value ''1em2em'' would be parsed as a + single DIMEN token with the number ''1'' and the identifier + ''em2em'', which is an invalid unit. In this case, a space would be + required before the ''2'' to get this parsed as the two lengths ''1em'' + and ''2em''. + +

+Property value examples

+ +

Below are some examples of properties with their corresponding value + definition fields

Here are some sample properties with corresponding value definition fields: @@ -125,8 +224,6 @@ syntax used in the value definitions fie

The value definition fields contain keywords, data types (which appear between "<" and ">", and information on how they can be combined. Generic data types (<length> being the most widely used) that can be used by many properties are described in this specification, while more specific data types (e.g., <border-width>) are described in the corresponding modules. -

Syntax and terminology

The generic data types described in the next sections use some