How can css not inherit styles?

How to implement css that does not inherit styles: first open the corresponding code file; then clear the style by overwriting; then extract the style part that is not easy to change; and finally apply it to different modules in a combined manner. Can.

The operating environment of this tutorial: windows7 system, css3 version. This method is suitable for all brands of computers.

Recommended: "css Video Tutorial"

Inheritance of css: It is to set some properties to the parent, and the child inherits the properties of the parent. This is what we inheritance in css. Officially explained, inheritance is a rule that allows styles to be applied not only to a specific html tag element, but also to its descendant elements.

Sometimes, CSS inheriting the style of the parent element can be troublesome. Is there any way to clear inherited styles? How to prevent css from inheriting styles?

Currently, styles can only be cleared by overwriting.

This issue should be taken into consideration when writing css.

Generally, there are only common styles and fixed structures. Modules are suitable for using inheritance to apply css

Otherwise, styles should not be inherited casually. For two modules with little difference in structure or performance, inheritance is not suitable for implementation

Good point The method is to extract the same style parts that are not easy to change, and then apply them to different modules in a combined manner.

For example, two divs

can extract common styles and put them under one statement:

.fixedAd {position:fixed;width:200px;height:200px;border:1px solid #ccc;}

Then write your own styles for different divs:

.a {color:#ffc;background:#ccf;} .b {color:#777;background:#999;}

The final combined html structure is:

In short: combination is better than inheritance. This is similar to programming, haha

The above is the detailed content of How can css not inherit styles?. For more information, please follow other related articles on the PHP Chinese website!