CSS cascade and inheritance, CSS cascade inheritance

CSS cascade and inheritance, CSS cascade inheritance
Three inheritance methods of css 1. Intra-segment inheritance

<PStyle = "color: red; font-size: 50px ;">Original Style</P>

Both are implemented by changing the value of the style attribute. Syntax details:

1. Each style attribute has a different value. "color: red" indicates the attribute of color through a colon.

2. Use semicolons to separate and close attributes.

3. font-size is a composite attribute

2. Document inheritance

<Style> the <style> label must be used for global styles. It must be set between the

Style-type declares the function type of css

P {style attribute} p is the scope, or other labels such as <table> <input>. p is just an example.

Inheritance in a document has a lower priority than that in a segment, and takes precedence over those in the segment. Therefore, in the <p> style, the first original article executes the global style, the second executes the style in the segment.

 

@ Import overlays multiple layers of styles. Style

 

Stacked style: The reference mechanism changes the style into a repository and can be called when you want to call it. You can set it on the current page when you want to personalize it.

1. The higher the style priority of the inner layer, the modification of the inner layer will not affect the style to be referenced by the outer layer.

2. The sum (SET) of the outer and inner styles is the display style.

3. The outer layer contains the inner layer, style conflicts (intersection), and the priority is: Intra-segment inheritance> intra-file inheritance> out-of-file inheritance> tag style.

 

Supplement:

 

1. Label style with the lowest priority, that is, some labels originally implied style, such as <B> bold, h1-h6 these.

 

<B> This is an implicit bold setting, but it is the lowest priority, so it is overwritten.

 

2. Do not inherit style inheritance only applies to the appearance of elements (text, color, Font, etc)

Layout style will not inherit !, If you want to use it, you need to use inherit.

 

<P> border <B> border </p>

Boarder indicates the border.

When there is no inherit, the border-less part will not be affected because the <p> style has a border declared in the head <B> There Is A 1px red border in it.

If you want to add borders in <B>, you need to use inherit to force inheritance. (for example)

 

3. The style sequence in the head file takes priority.

 

4. Over-level file head styles take precedence over intra-segment styles

Important is equivalent to the top-stick function of diansong .... Shameless