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

This article shares with you the content of a sample analysis of CSS cascading styles. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

CSS cascading

CSS cascading is a feature of browsers that handle conflicts. If multiple selectors are set in a property, only one selector will work at this time, and all other selectors will be removed from the cascading part.

Conditions for cascading

(1) same elements

(2) same attribute

(3) same priority

Cascading style conflicts

(1) conflict of citation mode

The citation methods of CSS include inline style, inline style, import style and link style. The priority order of the four styles is inline style > embedded style > import style > link style.

Example:

Body {

Background-color:pink

}

Priority

The effect picture is as follows:

(2) conflict of inheritance mode

There are some properties in CSS that inherit the value of this property with their own offspring when they are set, such as setting color, font size, font shape, alignment and so on in CSS. But with regard to box, positioning, layout and other properties, inheritance will not occur.

The inheritance conflict is to display the nearest parent element instead of all the parent elements

Example:

Body {

Color:pink

}

# father {

Color:red

}

# grandfather {

Color:blue

}

Inheritance conflict

Thank you for reading! This is the end of this article on "sample Analysis of CSS cascading style". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!

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.