新人小白与css盒模型初次接触

        半个月前，我第一次接触了前端，而且对前端产生了浓厚的兴趣，从一开始的新奇，到现在的慢慢了解，让我更加觉得web前端很神奇。从一开始HTML的基本结构及语法，到后来学会了自己做表格，从一个简单的字符，到一个表格的完成，让我逐步了解了一个网页的建立。最近学习了盒模型，那么就来写写自己对于盒模型的简单了解与认识。

        盒模型呢，我们可以把他比喻成一个装着贵重物品的快递盒。首先把物品称作是content，内容物。既然说是贵重物品，当然不可能只把东西放在里面，我们要给这个东西包裹上厚厚的泡沫，来保证在运输过程中物品不会被损坏。这一层泡沫，也就是在物品和快递盒之间的填充物，我们就把他叫做padding。快递盒的厚度，我们给他一个名字叫border。在许多快递盒装箱的时候，可能会有快递盒被挤压、或者颠簸的情况，那我们就要考虑在众多快递盒之间隔开一些距离来防止盒子之间产生碰撞，这个距离我们把它叫做margin。

       那么在快递盒里，泡沫的厚度是不固定的，当泡沫厚的时候，相当于padding的值变大，我们就在盒子里放一些小的东西，来减少盒子里物品的height值与width值，让盒子不被撑大。也就是说，我们在设置height和width的时候要减去padding的值。

        关于padding和margin，应该怎么区分呢。在上文我写到了padding就是物品与盒子之间的泡沫，就是控制物品与盒子之间的距离的东西。物品跟盒子是一个包含在另一个里面，其实就像我们的父子关系一样，对于这种父子关系之间的距离，我们就用padding来控制。至于margin，是盒子之间的塑料泡沫，也就是说，他们的关系就像同学之间，是平等的关系，那对于这种同级关系，我们就用margin。

        以上就是现阶段逆战班的我对于盒模型的初步认识。