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

This article is about the difference between id and class in CSS. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

The difference between id and class

Id is unique, and class can have many

Only one ID can be written to the page, but more than one can be written to class.

However, this does not mean that you have to use id if only one page is displayed. There are constraints in the use of id.

If there is a style conflict between id and class, id takes precedence

Let's give an example to see.

HTML

ID and class priority comparison-text color

CSS

# red {

Color:red

}

.blue {

Color:blue

}

The effect is as follows:

360 screenshot 20181117113530790.jpg

The font shown in the image above is red, because id has a higher priority than class, so the final color is red.

You can jump to id within the page

By linking to id, you can jump to the appropriate id location.

Jump to id

Often use this to set the jump function at the beginning of the page.

Where can I use id

First, as a major premise, there are no restrictions on the use of class, but there are restrictions on id.

Frankly, you can do this all the time, even if you describe it in class without using id, so instead of thinking about how to distinguish between uses, consider where to use id.

The place to use id is "only" or "best".

When you want to add an in-page jump function

When using the intra-page jump feature, use id because it cannot be implemented in class.

Used in a place where you can set "unique"

There is basically only one part of the page, such as title, content, sidebar, footer. Such things are easier to implement using id.

Summarize the common parts of class and overwrite the style with id

This is a specification that leverages CSS, where id takes precedence over class.

The web page has a certain layout according to the page, but there are many similar parts. You can compress CSS by writing standard styles as class and writing feature portions of each page using id.

The selector matching process of id is faster

When performing selector matching processing such as jQuery, it is faster to specify id. This is because if it is specified by id, the processing can be done by finding it on the page, and if it is class, it needs to be scanned to the end.

Thank you for reading! This is the end of the article on "what is the difference between id and class in CSS". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!

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.