字体图标的引用及页面布局盒模型常用属性

字体图标引用

布局规则和元素类型

1. 常见的页面布局一般都是：宽度受限，但是高度无限
2. html文档的元素默认在浏览器中按照文档刘的顺序排列，html中哪个元素在前就页面中显示在前
3. html是一个二维空间，二维空间中的元素排列方式只有两种：水平、垂直；默认先水平，排列不下，再换行按照垂直方向排列
4. 元素的类型有两种：

   内联元素

   内联元素排列方式为一个一个并排，所在行排满后就会换行显示。
   内联元素属性：display:inline

   块元素

   块元素的特征就是独占一行
   块元素属性：display:block

盒模型的常用属性

1、width
2、height
3、border
4、padding
5、margin
6、box-sizing 改变了盒子大小的计算方式

盒模型的box-sizing属性改变了盒子大小的计算方式

1. 当box-sizing属性为：border-box时，会限制盒子的总宽度为height和width，padding和border不变，但是会让内容区自适应大小
2. 当box-sizing属性为：content-box时,会限制内容区为height和width，padding和border不变，会让盒子总大小自适应