css布局

需要关注的一些点：

1 display属性：元素都会有自己默认的display属性值，一般最多的是block和inline

   block: 一个块级元素会新开始一行并且尽可能撑满容器，如：p, form

   inline: 一个行内元素可以在段落中包裹一些文字而不会打乱段落的布局，如：span, a

   none: 一些特殊元素的默认 display 值是它，如：script（把 display 设置成 none 元素不会占据它本来应该显示的空间）

2 盒模型：当你设置了元素的宽度，实际展现的元素却超出你的设置，这是因为元素的边框和内边距会撑开元素

   盒模型中，元素的padding值和border的宽度会在原来元素的宽度上再外面扩张，不会占用原来的宽度，所以整个元素会变大

3 针对上面盒模型的padding和border会撑开盒模型的情况，新增了一个属性：box-sizing，当box-sizing:border-box时，padding和border则会占用原来元素的面积，而不会向外扩张

4 position属性

5 float属性