css four positioning summary memo_html/css_WEB-ITnose

The core of css layout is the position attribute, position: static || relative || absolute || fixed

static is the default attribute

Relative positioning:

Relative positioning is relative to its original position in the document (or the default position). Next, you can use the top, right, bottom, and left attributes to change its position.

Three characteristics of absolute positioning:

1. After setting to absolute positioning, the default width becomes the content width

2. Set to The absolutely positioned part is out of the document flow

3. The default reference for absolute positioning is the first positioned ancestor/root element

Fixed positioning:

The context of a fixed positioned element is the view window, and it will not move as the page scrolls. Fixed positioning is not commonly used, and is most commonly used to create navigation elements that do not move as the page scrolls.