盒子模型

2018-05-15
H5原生与OC交互第三次课-盒子模型

网页中每一个标签都是一个盒子。
每一个盒子都有四个属性。

内容（content）

盒子里中的东西

height、max-height、max-width、min-height、min-width、width

填充（padding，内边距）

理解：盒子里面的（贵重的）东西损坏，而添加的泡沫或者其它抗震动辅助材料

padding、padding-bottom、padding-left、padding-right、padding-top

padding:10px 5px 15px 20px;//上、右、下、左
padding:10px 5px 15px; //上、左右、下
padding:10px 5px;// 上下、左右
padding:10px;//自己想吧

边框（border）

盒子本身

border:5px solid red; //border-width、border-style、border-color
border-radius // 圆角

边界（margin，外边距）

margin、margin-bottom、margin-left、margin-right、margin-top

margin:10px 5px 15px 20px;//上、右、下、左
margin:10px 5px 15px; //上、左右、下
margin:10px 5px;// 上下、左右
margin:10px;//自己想吧