Home >Web Front-end >Front-end Q&A >What is the difference between class and id in html5

What is the difference between class and id in html5

WBOY
WBOYOriginal
2022-03-16 11:41:373264browse

Difference: 1. Different scopes, class has a larger scope, while id has a smaller scope; 2. Different priority levels, the id selector has a higher priority, while the class selector has a higher priority The level is lower; 3. The usage syntax in CSS is different. Class is selected by "." and id is selected by "#".

What is the difference between class and id in html5

The operating environment of this tutorial: Windows 10 system, HTML5 version, Dell G3 computer.

What is the difference between class and id in html5

id

is a unique identifier, which is similar to our ID number. Get tags quickly Object and perform operations on it.

When we use id to modify the label style, we use #id to represent it.

Class

points to a class, that is Say, if there are four tags with the same style, for convenience, we put the styles of these four tags into a Class. When we need to use it, we directly let the tags inherit from this Class class to achieve To reduce the amount of code, if we still need to accurately control four tags, we can use id and class to control one tag at the same time!

When we use Class to modify the label style, we use .Class to represent it.

The difference is as follows:

  • The scope of the effect is different: The scope of class is larger than that of id, which represents a unique identifier, just like our personal ID card. It is unique and can only be called once on a page. Generally, a web page does not have two or more IDs. The scope of class is wider. Class is a class label and can be called multiple times in an interface. Can be reused.

  • The priorities are different: the priority of the id selector is higher than the priority of the class selector. For more important ones, you can use the id selector.

  • The syntax used is different: the way the id selector is used in css, such as using div as an example: (For example, there are div id='i'...and div class=' c'...Two div boxes, the method quoted in css is as follows:)

.c{
属性:属性值;
} 
#i{
属性:属性值;
}

Recommended tutorial: "html video tutorial"

The above is the detailed content of What is the difference between class and id in html5. 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