- Margin ( margins) - clear the area outside of the frame, it is transparent from the outside.
- Border ( Borders) - around the inner and outer margins content border.
- Padding ( padding) - clear the area around the content, padding is transparent.
- Content ( content) - the contents of the box, displaying text and images
The total width of the element width = + left + right padding filling + + left border to the right block from the left + right margin +
The total height of the element height = + + apex filler filling the bottom border + + + margin lower margin frame at the +
The order of four weeks from the outside is provided on the left margin of the lower right setting,
Margin: = = the left and right, for example, may be set individually margin-top
Padding : padding is provided as padding: 20px;
Border : Border border: 2px solid black;
Overflow handling
Overflow hidden
overflow:hiddeen
Overflow will add a scrollbar
overflow:scroll;
float
1. The relative positioning (relative position div itself, the original position)
posistion:relative
Must use relative positioning with position
E.g
The original 20px from the right move
posistion:relative
right:20px;
2. :( absolute positioning relative to the first parent element with position style
If the parent element has no position will always look up until I find a parent element,
If the element does not have a parent element located, then its position relative to the <html>:
If they did not find the body tag)
position：absolute;
3. :( fixedly positioned relative to the positioning screen)
position；fixed
Z-axis coordinate, who should show large values who, when using two overlapping blocks div
z-index: 1000;
Clear float
- Float: float: left / right; can not rely on an intermediate;
Div on two parallel blocks are left floating,
2. Clear float, div block floating div not want to be covered quickly.
clear:left/right; both(两者)