HTML CSS Layout tips

HTML CSS Layout tips

All the time, I have not mastered the CSS layout very well. After this period of exercise, rose a level.

General Experience said: more practice more Baidu. One side of the change. Learn from the mistakes, always can learn. Though slow. But it's worth it, to be able to learn the CSS layout at a high speed the following are some of the knowledge points that must be mastered:

1th: To understand the box model

2nd

Display:inline-block, no line change, wide height

Display:inline, no line break no width height defines height and width also invalid

Display:block, the line has a wide height

Display:table is wide and wide, can be changed with the content.

The difference between the four. As well as these 4 values of the line, wide, high impact.

3rd

Position:absolute; Absolute positioning of the parent element position: must be relative to lefttop the right bottom relative to the parent element

position:relative;

position:fixed;

position:static;

4th:

Float:left all elements are arranged from the left to the height of the current element to 200px the height of its parent element is 100px the starting position of its Uncle element is determined according to the height of its father.

To change must be clear:left or clear:both;

HTML CSS Layout tips