The difference and usage of ID and class in CSS

IDS can only be used once in a Web page. Of course, even if an ID is used more than once in a Web page, its CSS style can still be implemented, but the general rules of the universal standard are used once. Because ID in HTML can give HTML tags special attributes such as JS action, table conveys values and so on characteristics so different from a class can use how many times, and a CSS named ID can only use once to avoid some specific actions, The compatibility attribute error of the passed form value even if there is no other JS script action, table conveys value attribute but we must also execute a page can only be used once.

The ID selector is defined by "#", naming the CSS selector.

To define a named CSS ID selector example:

#yangshi1 {color: #F00;} Define Red

#yangshi2 {color: #0F0;} Define Green

Corresponding div reference in HTML

<div id= "Yangshi1" > My color is red </div>

<div id= "Yangshi2" > My color is green </div>

The definition of a DIV tag can only be used with one ID such as:

<div id= "Yangshi1" id= "yangshi2" >www.divcss5 test content </div>

Or

<div id= "Yangshi1 yangshi2" >www.divcss5 test content </div>

All two are incorrect and CSS style properties are not valid-become one of the CSS failures.

CSS class Knowledge:

Unlike CSS IDs, the Clsss class can be referenced indefinitely within a Web page.

The Class selector defines the "." To define. Define CSS Class Selector example:. Yangshi1{color: #F00;} define text as red. yangshi2{font-size:28px;} Define text size of 18px

DIV+CSS references in corresponding HTML:

<div class= "Yangshi1" > My color is red </div>

<div class= "Yangshi2" >www.divcss5.com my font size is 28px</div>

<div class= "Yangshi1 yangshi2" > My color is red text size is 28px</div>

The above is the correct use of "Yangshi1" "Yangshi2" class

Extended knowledge: Can I use the digital naming CSS property selector CSS naming conventions

Here's how to use the wrong CSS class:

<div class= "Yangshi1" class= "Yangshi2" > I will be invalid </div>

Such a reference method is the wrong way to refer to the same, you can also draw a "class=" if multiple CSS classes appear to apply to a div tag, you can use the <div class= "Yangshi1 yangshi2" > to apply.

The use of IDs and class within a DIV tag is possible:

. yangshi1{...}

#yangshi2 {...}

. yangshi3{...}

<div class= "Yangshi1" id= "Yangshi2" > this is possible and correct.

<div class= "Yangshi1 yangshi3" id= "Yangshi2" > is also correct and desirable.

Summarize:

This article explains the application of ID and class in div css from the point of knowledge to the example, and needs to pay attention to the place and use the reference method correctly. CSS instance through DIVCSS5 in the right and wrong use of CSS ID and CSS class so that everyone can grasp the basics of CSS.