[Reading Notes] CSS Authoritative Guide_html/css_WEB-ITnose

Chapter 1 CSS and Documents

CSS: cascading style sheet

W3C: world wide web consortiam

Element is a document Basic, divided into

Replaced element: refers to the content part used to replace the element that is not directly represented by the document content.

Non-replaced element (nonreplaced element): its content is represented by the user agent (Usually a browser) Display

in a box generated by the element itself (block-level): Generates an element box with "separators" generated before and after the element box. Block-level elements will fill the content area of ​​their parent elements

Inline elements (inline-level): Generate element boxes within a line of text without interrupting the line of text. Do not generate "separators" before and after itself

In HTML and XHTML, block-level elements cannot inherit their own internal elements, and CSS has no restrictions on how roles can be nested

External style sheet )

Alternate style sheet: The rel attribute is set to alternate stylesheet, and the document will always be displayed only when the user selects this stylesheet. Title is also an attribute of link. The browser will use the title attribute value of the link element to name the candidate style sheets. The candidate style sheets with the same title value will be grouped together by the browser. IE itself does not support candidate style sheets. It can be supported through javascript

If a title is specified for a link whose rel is stylesheet, it also specifies that the style sheet should be used as the preferred style sheet (preferred style sheet). If If a group of style sheets is designated as the preferred style sheet, then only one of them will be used

Document style sheet, nested style sheet

@import url() can only appear in the style container, and CSS requires the @import directive to appear before other rules in the style sheet, otherwise it will be ignored (IE will not ignore any @import directive)

Backward accessibility: Include the declaration in an HTML comment tag. Older browsers that do not support style will ignore the style, and subsequent declarations will be commented out.

CSS comments: /* */ Nesting is not supported

Inline style: Not recommended

Chapter 2 Selector

Each style sheet is composed of A series of rules composed of

Rules: selector Declaration block

Declaration block consists of one or more declarations, each declaration is an attribute-value pair ( property-value)

Element selector: HTML element

In almost all cases, the value is either a keyword or a list of keywords that can be used for the property, one of the keywords Separate them with spaces. If incorrect attributes or values ​​are used in the declaration, the entire declaration will be ignored

Special case: h2 {font: large/150% sans-serif}; Slashes are used to separate setting fonts Two keywords for size and row height

Selector grouping: Separate different selectors with commas

Universal selector: Displayed as a * and can be used with any element Match

declaration grouping: add a semicolon at the end of each declaration. Usually a grouping that combines selectors and declarations

class selector: to apply styles regardless of the specific elements involved .class{property:value}