Selectors in CSS

1. How to introduce CSS in HTML: Four ways:

A. Inline (also known as inline) such as:

<H1 style= "color:red;test

B. Built-in

<style type= "Text/css" >

h1{

color:red;

font-size:10.5pt; Font-family:calibri, Sans-serif; Line-height:normal; Widows:auto; " >}

</style>

C. Import type

<style type= "Text/css" > @import "mystyle.css";</style>

D. Link-type

<link href= "Mystyle.css" rel= "stylesheet" type= "Text/css"/>

2.CSS selector: Includes basic selector and composite selector

Basic CSS selector: such as h1{color:red;font-size:25px;} Here H1 is the selector name, color and font-size are attributes, and red and 25px are values.

The basic CSS selector includes the tag Selector, class selector, and ID selector.

Tag Selector: The name of the selector that makes up the CSS by the markup of the HTML, as described in the example above.

Class selector: Can be applied to different elements. For example, <p> elements and

ID Selector: Like the class selector, it is named by the developer. The ID selector can only be assigned to one element.

When the category selector is defined, the. begins to be applied in the element through the class attribute.

The ID selector is defined with the # start to be applied in the element by ID.

Note: The class selector and ID selector have precedence over the tag Selector.

Composite selector:

Intersection selector:

Div.special{...}

Div#special{...}

The intersection selector refers to a class selector or ID selector, followed by a tag selector, that indicates that the tag selector must be satisfied and that the following category or ID must be declared.

The "Set" selector:

Div,h1.first,p.specia{...}

Multiple selectors are connected by commas, as long as the elements that satisfy either selector are selected.

Descendant selector:

div h1.first span.firstletter{...}

Multiple selectors are connected by spaces, indicating that elements that satisfy all selectors at once are selected.

CSS inheritance features: When you use CSS to set an element, such a setting will work on that element, as well as on all child elements of that element. (Document Structure object model DOM)

CSS cascading features: Resolve the overlap of styles.

Rules: Inline styles >id styles > Category styles > Marker styles

Selectors in CSS