[Reading Notes] CSS authoritative guide, Reading Notes css authoritative

Source: Internet
Author: User

[Reading Notes] CSS authoritative guide, Reading Notes css authoritative
Chapter 1 CSS and documentation

CSS: cascading style sheet

W3C: world wide web consortiam world wide web Alliance

Element is the basis of a document.

  • Replaced element: used to replace the content of an element, which is not directly indicated by the content of the document.
  • Nonreplaced element: the content is displayed by the user agent (usually a browser) in the box generated by the element.
  • Block-level elements (block-level): generate an element box and generate a "separator" before and after the element box ". A block-level element fills the content area of its parent element.
  • Inline-level: an element box is generated in a text line without interrupting this line of text. It does not generate a "separator" before and after itself"

In HTML and XHTML, block-level elements cannot inherit self-contained elements. CSS has no restriction on How to nest roles.

  • External style sheet (external style sheet)

<Link rel = "stylesheet" type = "text/css" href = "" media = "all"/>

  • Candidate style sheet: sets the attribute of rel to alternate stylesheet, which is always displayed when the user selects this style sheet. Title is also an attribute of link. the browser uses the title attribute value of The link element to name the candidate style sheet. The same title is also a candidate style sheet that will be grouped by the browser. IE itself does not support candidate style sheets, which can be supported by javascript

If you specify the title for a link whose rel is stylesheet, the style sheet must be preferred style sheet (preferred style sheet ), if you specify a group of style sheets as the preferred style sheet, only one of

<Style type = "text/css"> </style> document style sheet, nested style sheet

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

Backward accessibility: the Declaration is included in the HTML annotation tag. Older browsers that do not support style will ignore the style, and the subsequent declaration will be commented out at the beginning.

CSS comments:/**/Nesting is not supported

  • Inline style: Not recommended
Chapter 2 Selector

Each style sheet consists of a series of rules

Rule: selector declares a block (declaration block)

A declaration block consists of one or more declarations. Each declaration is a property-value pair)

Element selector: HTML Element

In almost all cases, the value is either a keyword or a list of valid keywords in this attribute. keywords are separated by 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}; the diagonal lines are used to separate two keywords for setting the font size and Row Height.

Selector group: Use commas to separate different selectors.

Universal selector: displays as a * and can match any element.

Declarative group: add points at the end of each declaration. Generally, a group that combines selector and declaration is used.

Class seector: applies a style without considering the specific elements. class {property: value}


CSS authoritative guide

This is my first CSS, which is a printing plate. There are no examples in the book and it is not very suitable for beginners. But as an afterthought reference, it is quite practical. When you do something, you will understand what you cannot think. ......

Chinese version of CSS essence and CSS authoritative guide

Css is mainly used for multi-practice and multi-write operations. You can view their css on major portal websites, and you can also go to Netease College's video learning advanced stage css.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.