1. The principle of the box model
Actual width = left outer margin + left border + left inner margin + content + right inner margin + right border + right outer margin
2. Positioning:
1) Absolute positioning (the reference point is the origin of the upper left)
position: absolute;
(in conjunction with top / bottom / left / right)
2) Relative positioning (the reference point is its own position)
position: relative;
(in conjunction with top / bottom / left / right)
3) Fixed positioning
position: fixed;
(combined with top / bottom / left / right)
Including block setting:
set to include the block element, the reference point is the upper left corner of the element, the
moving range is the size of the containing block element
4) floating positioning
float: none / left / right;
Note: if there is an element to Floating, adjacent elements also need to add floating! ! !
Clear float:
clear: left / right / both;
Note: If you want this element to not float, use
3. Overflow attributes:
overflow: hidden / scroll / visibility (default display);
text-overflow: ellipsis; (display after text exceeds)
4. Cascading
z-index: numbers (no units); the
larger the number, the higher, and the lower, the lower
5. Set the center:
margin: 0px auto;
