12.div+css布局

1.盒子模型

• width——宽度
• height——高度
• border——边框
• margin——外边距
• padding——内边距

• 作用：思想——用来摆放内容的位置；

2.margin简单注意的问题：

• body有默认的margin，chrome默认8；

3.padding 用来调整内部内容的摆放；

• 设置pedding后会将外层的盒子撑大,pedding撑大多少，width或者height减多少；

4.块级元素和行内元素

• 块级元素：独占一行:div h p li 等，独占一行，可设置宽和高；
• 行内元素：span a img i 等在一行展示，一般情况不可设置宽和高；

/*转化为块级元素，支持宽高，但独占一行*/
display: block;
/*转化为块级元素，支持宽高,同时显示在一行*/
display:inline-block
/*将块元素转化为行元素*/
display: inline;