CSS beginners: Custom categories

Custom category
Today we are talking about a new knowledge category ". In fact, this knowledge is no stranger! In retrospect, there was an attribute in the HTML tag called class, which didn't explain what the attribute was. In fact, it is not an explanation, but an explanation that will not be used, so I have not said it for the time being. This class attribute is interpreted as a "category" attribute. What does it do? It allows us to use the same CSS settings in different labels. For example, we often see important points in textbooks when reading books, marked in red or other colors. What do you do if we want to display some important items in red and bold Chinese on our webpage today? :
Original Code
"<Font color =" Red "> <B> Web taoba </B> </font>"
Display result
"Web Tao BA"
Highlight with CSS
The method above is quite good! Easy to use and understand! However, imagine a situation... if there are more than 1000 so-called "focuses" on our webpage, and today you suddenly want to change the focus to "Red and bold", what should you do? Now, let's talk about how to use CSS to solve the problem! In addition, our "custom category" will be used!
Style Syntax
<Style type = "text/css">
. Important {color: red; font-weight: bold}
</Style>
Application method
"<Font class =" important "> Webpage Tutorial network </font>"
First, we create a category named important in the CSS table, and then apply it to the webpage using the class attribute! If you want to change "red" to "blue" in the future, you only need to change the settings in the category! No matter tens of thousands of "key points" on the webpage, you don't have to worry!
Custom category usage
After reading the general usage of the custom category, let's explain in detail how to customize the category? The custom category method is very simple, and there is no difference between the method and general CSS declaration! The only difference is that the CSS declaration targets a tag, while the custom category is not for a tag, but for its own name!
Style Syntax
<Style type = "text/css">
. Important {color: red; font-weight: bold}
</Style>
For example,. important {color: red; font-weight: bold} is our custom category. The {} section is exactly the same as the general CSS declaration method! The difference lies in the previous. important. That's right! Important is our custom name. It can be called only when it has a name. Note! Remember to add a small dot "." before the custom name to complete the custom category! This category can be called using class! Apply to any tag!