Three basic positioning mechanisms in css

Three basic positioning mechanisms in css

a. Ordinary document flow

b. Positioning: relative positioning

Absolute positioning

Fixed positioning

c. Floating

1. In ordinary flow, the position of elements is determined by the document order and element properties. Block-level elements are arranged from top to bottom. The vertical distance between boxes is determined by the The vertical margin value is calculated, and the inline elements are arranged horizontally in a row

2. Relative positioning is regarded as part of the normal flow. The moved element still occupies the original position. Moving the element will cause it to cover other boxes

3. Absolute positioning is relative to the nearest ancestor element that has been positioned, and absolute positioning is out of the ordinary flow

4. Fixed positioning is relative to the positioning of the browser window

5. The floating element can move left and right until the edge of its outer border touches the edge of the box containing itself or another floating box

6. The floating element breaks away from the ordinary document flow

7. Inline Elements and inline block elements will be arranged around the floating box, and block elements will be covered

For more three basic positioning mechanisms in css, please pay attention to the PHP Chinese website for related articles!