CSS Common Selector

CSS Common selectors: Tag Selector, class selector, id selector, derivation selector, sub selector, combo selector

1: Tag Selector: If it is a declaration, you do not need a semicolon, and if you have multiple declarations, the last declaration does not require a semicolon

h1{color:red}

h1{color:red; font-size:14px}

2, class selector: In the CSS with a point beginning to represent the category selector definition, the name of all classes of selectors start with a point, after the period must start with a letter, the class name is allowed to use the word, number, hyphen "-" and underscore "_", class names case, class selector can be used alone, It can also be used in conjunction with other elements.

. important {color:red;}

*.important {color:red;}

Use with other elements

p.important {color:red;}

The selector now matches all p elements that have the class attribute containing important, but none of the other types of elements match, regardless of whether or not this class attribute is present.

3. ID selector: The ID selector can specify a specific style for HTML elements labeled with a specific ID. The ID selector is defined as "#".

#red {color:red;} #green {color:green;}

The ID selector can only be used once. ID selector and Derivation selector

#sidebar p {font-style:italic;text-align:right;margin-top:0.5em;}

The above style will only apply to paragraphs that appear in an element with an ID of sidebar. This ID selector can be used many times as a derived selector, even if the element labeled Sidebar only appears once in the document:

#sidebar p{font-style:italic; text-align:right; margin-top:0.5em;}   #sidebar h2{font-size:1em;font-weight:normal; font-style:italic; Margin:0;line-height:1.5;text-align:right;}

Defines the style for the label within the label. Derived inheritors

H1 strong{color:red;}

Change color only when <strong> appears in the

Child selector: Sub-selector (child selector) refers only to its immediate descendants

#links >a{Color:blue;}

The combo selector applies the same style to multiple elements, allowing multiple selectors to be combined, separating them with commas.

H1,H2,H3,H4 {color:red;}

This article from "Don't Make good" blog, reprint please contact the author!

CSS Common Selector