对盒模型的理解

	首先这是我第一次写博客，请大家多关照。写的不好的地方请指出来。。。下面由我来说下我对盒模型的理解。
	我呢是一个刚入门三个礼拜的小白，我自认为学前端跟其他的科目是不一样的。前端是听得懂，但自己动手时就不会去做。可能这都是小白的必经之路吧。
	盒模型是网页布局的基石，盒模型由盒子内容  ，盒子内填充 ，盒子本身 ，盒子和盒子之间的距离（一般叫外边距）。盒模型有两个属性：**padding和margin属性** padding是盒子的内填充，长在盒子里面的。padding属性很特别，如果加了padding值 盒子就会被撑大（例如：气球，在我们没吹气的时候没变化 ，一旦我们吹气（相当于加了padding）气球会变大）![加了padding-left:80px;后的效果图](https://img-blog.csdnimg.cn/20200222200640503.png)
	padding有四个属性值 ：left(左)  right（右）  top（上）  bottom（下）
	padding :一个值值  表示四周都加padding
	padding:两个值时 	表示上下   左右
	padding:三个值时    表示 上  左右  下
	padding:四个值时    表示  上右下左
margin表示外边距(意思就是盒子与盒的间距)
例如：
![表示margin：50px  40px 60px 40px](https://img-blog.csdnimg.cn/20200222201823592.png)
	margin也有四个属性值 ：left(左)  right（右）  top（上）  bottom（下）
margin :一个值值  表示四周都加padding
margin:两个值时 	表示上下   左右
margin:三个值时    表示 上  左右  下
margin:四个值时    表示  上右下左

**两者的区别：**padding是加在盒子里面 margin是加在盒子外面
padding 一般加在父元素上 margin一般加在本身（控制谁就在谁上加）
padding加在父元素上要相应的减去相应的值（例外：如果盒子没有固定大小 添加padding值不需要减去）
margin 不需要减
border 是指边框 (包含内容的边框)
border 的属性值有 solid (实线) dashed(虚线) dotted(点状线) double(双线) none(没有线条)
**总结：**在网页上布局都需要这些属性，这就是我对盒模型的总结。