CSS positioning

position: element positioning method, values are static, fixed, relative, absolute

Positioning method should be used in conjunction with positioning attributes

Positioning coordinates: Specify the distance by which the positioned element is offset from the target element.

##Fixed positioning, position: fixed

Fixed positioning is relative to the browser window.
Fixed positioning, does not occupy space, and has a higher level than ordinary elements. It doesn't scroll as the web page scrolls.
If no positioning coordinates are specified, the position of the fixed positioning element will remain in place.
Fixed positioning element must be a "block element", no matter what element it is.

Relative positioning, position:relative;

Relative positioning, is relative to " "original self" to position yourself.
Relative positioning still takes up space and has a higher level than ordinary elements.
If no positioning coordinates are specified, the position of the relatively positioned element will remain in place.
With relative positioning, if it is an inline element originally, it will still be an inline element after positioning; if it is a block element originally, it will still be a block element after positioning.

Note: Relative positioning and absolute positioning are generally used together.

Absolute positioning, position:absolute

Position the element relative to its ancestors (relative positioning, absolute positioning) to perform positioning.

#If its parent element does not have any positioning, look for the positioning element upwards.
If no positioning element is found even though <body> is found, then positioning will be performed relative to <body>.

#Absolutely positioned elements take up no space and have a higher level than ordinary elements.
If no positioning coordinates are specified, the position of the absolutely positioned element will remain in place.
Absolutely positioned element is a "block element".

Automatic operation