Home  >  Article  >  Web Front-end  >  What are CSS selectors? What types of css selectors are there?

What are CSS selectors? What types of css selectors are there?

云罗郡主
云罗郡主Original
2018-11-03 14:44:315893browse

In CSS styles, they are generally composed of three parts, selectors, attributes, and attribute values. However, many CSS novices are not very familiar with CSS selectors. Let’s explain what a CSS selector is? What types of css selectors are there? [Recommended reading: Summary of 30 CSS3 selector usage]

Let’s look at a piece of code first:

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>什么叫CSS选择器?</title>
</head>
<body>
    <div>php1</div>
    <div>php2</div>
    <div>php3</div>
</body>
</html>

The effect is as follows:

What are CSS selectors? What types of css selectors are there?

What if we want to set php2 to blue? We must use a way to "select" the second div, and then change its CSS attribute color to blue. Like this, change a certain element to the effect you want, and select the label you want. The method is the so-called "selector", which means that the selector is a way of selecting elements.

The so-called selector, to put it bluntly, is to use a method to select the tag you want! Only after selecting it can you operate the CSS style of this tag. That's simple enough. CSS has many ways to select the tags you need, and these different ways are different selectors.

2: What types of css selectors are there?

1. Tag selector (such as: body, div, p, ul, li)

2. Class selector ( Such as: class="head", class="head_logo")

3. ID selector (such as: id="name", id="name_txt")

4. Global selection Selector (such as: *)

5. Combine selector (such as: .head .head_logo, note that the two selectors are separated by the space bar)

6. Inherit selector (such as: div p , note that the two selectors are separated by the space bar)

7. Pseudo-class selector (for example: it is the link style, the pseudo-class of the a element, 4 different states: link, visited, active, hover.)

8. Attribute selectors for string matching (^ $ * three types, corresponding to the beginning, end, and inclusion respectively)

The above is the explanation of what is a CSS selector? A full introduction to the types of css selectors. If you want to know more about CSS3 tutorial, follow the php Chinese website.


The above is the detailed content of What are CSS selectors? What types of css selectors are there?. 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