css-2010
The W3C Process and CSS:
WD(Working Draft)-->LC or LCED(Last Call Working Draft)-->CR(Candidate Recommendation) --> PR(Proposed Recommendation) --> REC(Recommendation)
CSS levels:
CSS1已放弃；CSS2.1替代CSS2；CSS3以CSS2.1为核心进行模块化开发。
Property Index:
counter-increment：[<identifier><integer>?]+| none | inherit
counter-reset: [<identifier><integer>?]+ | none | inherit
cursor: [ [<uri> ,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | text | wait | help | progress ] ] | inherit
direction:ltr| rtr | inhrit
empty-cells:show | hide | inherit
font:[ [ ‘font-style’ || ‘font-variant’ ||‘font-weight’ ]? ‘font-size’ [ / ‘line-height’ ]?font-family ] | caption | icon | menu | message-box | small-caption | status-bar | inherit
font-variant: normal | small-caps | inherit
page-break-after|before|inside: auto | always | avoid | left | right | inherit
quotes: q标
签：[<string> <string>]+ | none | inherit
table-layout:auto | fixed | inherit
text-transform:capitalize | uppercase | lowercase | none | inherit
unicode-bidi:设置文本方向：normal | embed | bidi-override | inherit
vertical-align：baseline | sub | super | top | text-top | middle | bottom | text-bottom | <percentage> | <length> |inherit
white-space : normal | pre | nowrap | pre-wrap | pre-line | inherit
widows:<integer> | inherit
word-spacing:normal| <length> | inherit
z-index: auto | <integer> | inherit设置元素堆叠顺序。高堆叠顺序位于较低顺序的前面；注：只能在定位元素上奏效。（如：position: absolute;）
Selector Index
*：所有元素
E:E元素
E[foo]:E元素拥有foo属性
E[foo="bar"]:E元素的foo属性正好等于
E[foo~="bar"]：E元素的foo属性其中有一个等于
E[foo^="bar"]：E元素foo属性开始字符串等于
E[foo$="bar"]:E元素foo属性结束字符串等于
E[foo*="bar"]:E元素foo属性包含子字符串
E[foo|="en"]
E:root
E:nth-child（n）
E:nth-last-child(n)
E:nth-of-type(n)
E:nth-last-of-type(n)
E:first-child
E:last-child
E:first-of-type
E:last-of-type
E:only-child
E:only-of-type
E:empty
E:link | visited
E:active | hover | focus
E:target
E:lang(fr)
E:enabled| disabled
E:checked
E::first-line
E::first-letter
E::before | after
E:warning(an E whose class is "warning")
E:#myid
E:not (s)
E F
E> F
E + F
E ~ F
[CSS-STYLE_ATTR]CSS Style Attributes
语法和css declaration block一样，除去首尾的大括号
优先级高于任何选择器
[CSS21]S1 About the CSS 2.1 Specification
1.1 CSS2.1比CSS2更接近当时的浏览器实现
1.4.2.1
<border-width> 和 <'border-width'>的区别
<border-width> 定义了border的宽度可取的值。:thin | medium | thick | <length>
<'border-width'>定义了'border-width'这个CSS属性可取的值。:<border-width>{1,4} | inherit
[] > && > || > |: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.
2 Introduction to CSS 2.1
2.1 A brief CSS 2.1 tutorial for HTML
HTML 引入CSS的几种方式：HTML element的style属性；HTML内部的style标签引入；HTML外部link标签引入。
The HTML 4 specification defines how style sheet rules may be specified for HTML documents: either within the HTML document, or via an external style sheet.
For maximum flexibility, we recommend that authors specify external style sheets; they may be changed without modifying the source HTML document, and they may be shared among several documents.
The LINK element specifies:
- the type of link: to a "stylesheet".
- the location of the style sheet via the "href" attribute.
- the type of style sheet being linked: "text/css".
The first thing to notice is that several declarations are grouped within a block enclosed by curly braces ({...}), and separated by semicolons, though the last declaration may also be followed by a semicolon.
The first declaration on the BODY element sets the font family to "Gill Sans". If that font is not available, the user agent (often referred to as a "browser") will use the 'sans-serif' font family which is one of five generic font families which all users agents know. Child elements of BODY will inherit the value of the 'font-family' property.
The second declaration sets the font size of the BODY element to 12 points. The "point" unit is commonly used in print-based typography to indicate font sizes and other length values. It's an example of an absolute unit which does not scale relative to the environment.
The third declaration uses a relative unit which scales with regard to its surroundings. The "em" unit refers to the font size of the element. In this case the result is that the margins around the BODY element are three times wider than the font size.
2.2 a brief CSS 2.1 tutorial for XML
XML depends more on style sheets than HTML
使用这个需要了解当前元素是行内还是块级。
XML区分大小写，大小写不同则表现也不同
2.3 The CSS 2.1 processing model
a user agent processes a source by going through the following steps:
- Parse the source document and create a document tree.
- Identify the target media type.
- Retrieve all style sheets associated with the document that are specified for the target media type.
- Annotate every element of the document tree by assigning a single value to every property that is applicable to the target media type. Properties are assigned values according to the mechanisms described in the section on cascading and inheritance.
Part of the calculation of values depends on the formatting algorithm appropriate for the target media type. For example, if the target medium is the screen, user agents apply the visual formatting model.
- From the annotated document tree, generate a formatting structure. Often, the formatting structure closely resembles the document tree, but it may also differ significantly, notably when authors make use of pseudo-elements and generated content. First, the formatting structure need not be "tree-shaped" at all -- the nature of the structure depends on the implementation. Second, the formatting structure may contain more or less information than the document tree. For instance, if an element in the document tree has a value of 'none' for the 'display' property, that element will generate nothing in the formatting structure. A list element, on the other hand, may generate more information in the formatting structure: the list element's content and list style information (e.g., a bullet image).
Note that the CSS user agent does not alter the document tree during this phase. In particular, content generated due to style sheets is not fed back to the document language processor (e.g., for reparsing).
- Transfer the formatting structure to the target medium (e.g., print the results, display them on the screen, render them as speech, etc.).
2.3.2 CSS 2.1 addressing model
CSS 2.1 selectors and properties allow style sheets to refer to the following parts of a document or user agent:
- Elements in the document tree and certain relationships between them (see the section on selectors).
- Attributes of elements in the document tree, and values of those attributes (see the section on attribute selectors).
- Some parts of element content (see the :first-line and :first-letter pseudo-elements).
- Elements of the document tree when they are in a certain state (see the section on pseudo-classes).
- Some aspects of the canvas where the document will be rendered.
- Some system information (see the section on user interface).
2.4 CSS design principles
The semantics of !important rules mean that users with particular presentation requirements can override the author's style sheets.