Home>Article>Web Front-end> what is css selector

what is css selector

藏色散人
藏色散人 Original
2021-04-12 15:14:26 6100browse

css selector is also called css style attribute and css attribute selector. The "selector" in css specifies the object of the "style" in "{}", which is the role of "style" Which elements in the web page are used; commonly used selectors can be divided into tag name selectors, class selectors, id selectors, derived selectors, child element selectors, and group selectors.

what is css selector

The operating environment of this article: Windows7 system, HTML5&&CSS3 version, Dell G3 computer.

What does the selector in css mean?

To use CSS to achieve one-to-one, one-to-many or many-to-one control of elements in an HTML page, you need to use CSS selectors. Elements in HTML pages are controlled through CSS selectors.

Commonly used selectors can be divided into: tag name selector, class selector, id selector, derived selector, sub-element selector, group selector, pseudo-element selector

Every A CSS style definition consists of two parts, with the following form: selector {style}, and the part before {} is the "selector".

The "selector" specifies the object of the "style" in {}, that is, which elements in the web page the "style" acts on.

Css selector is also called css style attribute and css attribute selector.

1. Tag name selector: find the specified tag through the name of the tag

Format: element name { }

2. Class selector: use the class attribute value of the tag Select the specified tag, multiple tags can have the same class value

Format: .d1{ }

3. ID selector: Find the tag by id, the id cannot be repeated in an html file

Format: #id{}

4. Derived selector (descendant selector): similar to a path, if a tag that meets the requirements is found, all descendant tags will be matched

Format: ul li a{} #id li a{}

5. Child element selector: similar to descendants, but only child elements

can be obtained. Format: ul>li>a{ }

6. Group selector: You can combine multiple selectors to use them to set styles uniformly

Format: h1,h2,#abc,.m{ }

7. Pseudo-element selector: The pseudo-element selector selects the status of the element. The status is divided into the following types:

link indicates the status of the element when it is not clicked

hover represents the state when the mouse is hovering

active represents the state when the element is clicked

visited represents the state after the element is clicked Format: #id:hover{ }

[Recommended learning: "css video tutorial"]

The above is the detailed content of what is css selector. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn