Shulou(Shulou.com)06/01 Report--

This article mainly introduces the relevant knowledge of "what is the concept of HTML selector". The editor shows you the operation process through an actual case. The operation method is simple, fast and practical. I hope this article "what is the concept of HTML selector" can help you solve the problem.

1. Wildcard selector-*: matches all tag elements in the page

The syntax is: * {attribute: value}; often used to define global styles, such as font size, color, etc.

two。 Element / tag selector-p, div, span, etc.: is to match a certain type of tag

Syntax specification: P {attribute: value}

3. Class selector-".className": a tag that matches a class name or group of class names.

Syntax specification: .className {attribute: value}

4. Category selector-"p.name": matches the target tag of the specified class name in a tag

Syntax specification: p.name {attribute: value} is to match the p tag with the class name name in the p tag

5.id selector-"# idName": a tag that matches an id value

Syntax specification: # idName {attribute: value}, note that this match absolutely has only one target, because id is not allowed to repeat, unique, because the corresponding target element of id is also unique, this way to locate the target element is the most accurate.

6. Group selector: this selector, not a special selector, means that when multiple elements have the same style, they can be separated by adding "," between the selectors, so that multiple elements can use the {} style.

Syntax specification: pdiv div {attribute: value}, meaning p div has the same style, which makes the CSS code concise and convenient.

7. Descendant selector: this way is matched by the position of the element. The descendant selector refers to a certain element, that is, all the elements within it, and locates the descendant elements of an element by the way of selector 1, selector 2; such as

Descendants of my div 1

Descendants of my div 2

Syntax specification: div p {attribute: value} so that you can choose to match all the p of the div descendant, whether it is the p of the first layer or the nth layer.

8. Descendant selector: this way is also matched by the position of the element. When it is different from the descendant selector, the descendant selector matches the first-tier offspring of a certain tag, which is only a father-child relationship, and the way is also different from the descendant selector. The way is through ">"

Syntax specification: div > p {attribute: value}

9. Pseudo-class selector: this selector identifies a state of an element by matching; pseudo-class selector classification:

A) Link pseudo-class: applicable to unvisited link a, namely a:link, and applicable to visited link a, namely a:visited.

B) dynamic pseudo class: hover when the mouse is over, active when the element is activated, and focus when the element gets focus (usually refers to the form).

C) Target pseudo-class.

D) pseudo-class of element status.

E) structural pseudo-class.

F) negation of pseudo classes.

This is the end of the introduction to "what is the concept of HTML selector". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.