What is the difference between CSS selector class and id? id and class usage in HTML

What is the difference between CSS selector class and id? id and class usage in HTML

Chen Weiliangcurrently executingSEO, optimize the site'sWordPresstheme.

Although I have learned some basic HTML and CSS knowledge before, but I haven't operated it for a while, especially the CSS part usage, it is easy to forget.

So, record and summarize the difference and usage of CSS selector id and class here:

• id corresponds to #div
• class corresponds to .div

The difference between id and class

id description

• id is a fixed tag, which is used to define the larger style in the web page, which is defined in the form of #div
• For example: dividing columns, top, body, bottom, etc...
• Used to define a specific element, which can only appear once per page and cannot be called repeatedly.

class description

• Class is a style group, which is used to define the detailed styles in the web page. It is defined in the form of .div and can be repeated.
• For example: a specific menu, a line of text, etc...
• On the same page, it can be called repeatedly by multiple elements

The div selector itself has no properties. By defining its css, it controls some layouts such as the width, height, background color and text size of the div.

generalE-commercewebsite,Building websiteThe html web page generated by the program is to realize the page layout through CSS.

What is a selector?

The definition of each CSS style consists of 2 parts:

选择器 {样式}

• The part before the {} is the "selector".
• The "selector" indicates the "style" of {} to which it acts.
• That is, on which element of the web page does this "style" work?

Code example

Here's how to select and style a class="sidebar" element:

.sidebar
{ 
background-color:black;
}

Here's how to select and style an element with id="footer":

#footer
{ 
background-color:black;
}