Positioning
| Positioning | content |
|---|---|
| Static positioning | position:static; |
固定Positioning |
position:fixed; |
相对Positioning |
position:relative; |
绝对Positioning |
position:absolute; |
| Sticky positioning | position:sticky; |
Explanation :
静态定位: The default value of HTML elements, that is, no positioning, elements that follow the normal document flow object
static positioning will not be affected by top, bottom, left, right
固定定位: Fixed positioning needs to be described under IE7 and IE8! DOCTYPE can support
Fixed positioning The position of the element has nothing to do with the document flow. Therefore, the
fixed positioning element does not occupy space and overlap with other elements
相对定位: the positioning of the relative positioning element is to
move the relative positioning element relative to its normal position . But the original space occupied by it will not change
绝对定位: absolute positioning The position of the element is relative to the nearest positioned parent element. If the element does not have a positioned parent element,
then its position is relative to <html>
absolute positioning so that the position of the element has nothing to do with the document flow. Therefore, it does not occupy space and the
absolutely positioned element overlaps with other elements
overflow
The default value of visible. The content will not be trimmed. The
hidden content will be trimmed, and the rest of the content will make the
scroll content invisible , but the browser will display the scroll bar to view the rest of the content
auto if the content Will be trimmed, the browser will display a scroll bar to view the rest of the content