CSS z-index attribute and cssz-index attribute

CSS z-index attribute and cssz-index attribute
Stack context: 3D concept, indicating the position of an element on the Z axis

Layers can be nested and combined into a hierarchical Context
Each cascade context and sibling element are independent. When performing cascade change or rendering, only descendant elements are considered.
Each stack is self-contained

Cascade order

1 background ~ Border2 negative z-index3 block box 4 float floating box 5 inline/inline-block box 6 z-index: auto/z-index: 07 positive z-index

Features

Negative value supported
SupportedCSS3Animation
Css2.1 needs to be used with positioning Elements
Such as positioning ElementZ-indexNesting: the principle of "back-to-back ".
If nesting occurs: The ancestor priority principle and premiseZ-indexIs a value rather than a valueAuto,AutoDo not create stack Context

Application

Default positioning ElementZ-index: auto;/z-index: 0
Z-indexNotAutoTo create a layered context.
Z-indexCascade order comparison stops at parent-level Cascade Context
AvoidZ-indexChaotic nested hierarchical relationships
AvoidZ-indexChaos, a flash of style problems higher than a mountain
Negative values can be used for hiding