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

This article mainly explains "how to divide the weight of css style priority". The content of the article is simple and clear, and it is easy to learn and understand. Please follow the editor's train of thought to study and learn how to divide the weight of css style priority.

First of all, there may be several different CSS attributes on the same tag. When these CSS attributes act on the same tag, there is a difference in priority. In general, the weights of simple selectors can be compared in the following order (from high to low):

The highest level of weight:! Important belongs to absolute priority.

Second level weight: interline style (inline style)

The third level of weight: id selector

Level 4 weight: class selector, pseudo-class selector, attribute selector

The fifth level of weight: tag selector, pseudo element selector

The sixth level of weight: wildcard selector (*), sub-selector (>), neighboring sibling selector (+), etc.

Lowest level weight: browser default styl

With the above rule, we can also know that the browser default style is the lowest because the wildcard selector can take precedence over it; because the wildcard selector style weight is very low, it is generally used to initialize the browser style in CSS.

The above is the case of different weights, so how to compare if the weights are the same? CSS can be understood as sequential execution, with the same weight in the case of the later code will overwrite the previous code.

Based on the above rules, you can get a way to avoid CSS conflicts: if you can increase the weight, increase the weight; if you can't, increase the weight to equal, and then put the style to be rendered later (this method is not recommended, as some browsers may not support it).

In addition, many readers will ask, isn't there the highest weight? Yes, you can use the highest weight for style locking, but this will make it difficult for the code to locate style errors, so don't use it unless you have to. In addition, the interline style should also be used as little as possible, because the standard division of labor between HTML and CSS, HTML is responsible for the text structure, CSS is responsible for style processing, if you use the interline style, it is equivalent to letting HTML be responsible for the style, which is not good for debugging the style.

Thank you for your reading, the above is the content of "how to divide the weight of css style priority". After the study of this article, I believe you have a deeper understanding of how to divide the weight of css style priority, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

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.