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

This article mainly introduces "what is the difference between class and id in CSS and how to use it". In daily operation, I believe many people have doubts about what is the difference between class and id in CSS and how to use it. Xiaobian consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful to answer the questions of "what is the difference between class and id in CSS and how to use it?" Next, please follow the editor to study!

Class is called "class" in the program, and it is also called "class" in CSS. The lowercase "dot" and "." in the CSS style To name such as: .css5 {attribute: attribute value;}, and in the html page with class= "css5" to choose to call, named CSS is also called css selector. For example: .css5 {attribute: attribute value;} selector calls "I am a class example" in html. If you don't know how to reference CSS, you can learn about css references.

And class (class) in the same html page can call the same class class countless times, in this example can be in the corresponding page can call countless times to select "css5". This also shows that class is generally used to call preconfigured attributes in css, for example, there is a preconfigured attribute such as ".class01 {attribute: attribute value;}" here, so that you do not need to configure a "class" attribute repeatedly in a web page like calling a function, but only need to write a class class selection, you can call and select the same CLASS class anywhere in the same page.

ID represents the identity of the tag, and id is used in the JS script. When JS wants to modify the attributes of a tag, JS will operate with the id name as the unique identity of the tag. In other words, ID is only the identification of page elements, which can be referenced by scripts of other elements, etc. If there are two ID on your page, then the JS effect feature is more logical than the logic error. I don't know which ID to change its tag attribute. ID in CSS is not necessarily set for JS, but ID can only appear once on the page, and it is unique. Although we may just learn that DIV+CSS lovers call the same ID on the same page many times but there are still no page clutter errors, we also have to follow the uniqueness of ID in one page for the sake of W3C and various standards. Avoid browser compatibility issues.

How is the ID in the Div css page used?

Usually we start with "#" when we define the CSS style, such as: # css5 {attribute: attribute value;} this is also a bit like the definition of class, except that class is lowercase full stop. " Start with a name, while ID is defined with a good start of "#". So how do you use id? The use of ID in Css is the same as that of class, except that class is replaced by id. For example: define ID in the CSS style-# css5 {height:25px;width: 200px;}, and call ID-I am the ID example.

Next, let's take a look at the complete CLASS and ID instances:

Examples of CLASS and ID in DIV CSS-- DIV+CSS-www..com

.css5 {width:100px; height:100px; border:1px solid # 000; float:left;}

.css5 _ class {background:#FFF;} / * White background * /

# css5_id {background:#FF0000;} / * background red * /

When I browse under the browser, the background of the content will be white.

I browse under the browser and the background of the content will be red.

Let's take a look at the above example: why is class= "css5 css5_class" like this? This is equivalent to selecting the class classes css5 and css5_class. Class= "css5" id= "css5_id" here also chooses to call the class class: css5 and id: css5_id.

At this point, the study on "what is the difference between class and id in CSS and how to use it" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

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.