盒模型的简单介绍

这里是IT修真院分享课,今天要分享的主题是

【盒模型的简单介绍】

W3C组织建议把所有网页上的对象都放在一个盒子(box)中,就是所说的盒子模型,CSS盒模型本质上是一个盒子,封装周围的HTML元素,它包括:实际内容(content)、内边距(padding)、边框(border),外边距(margin)。一个div就是一个盒子。

盒模型的简单介绍

通俗的来讲就是

盒模型的简单介绍

外边距决定的是两个盒子之间的距离。
当然在html中盒子是没有3D的,这张图仅便于理解,以第一张图为准。

了解盒模型之后,现在主要来区分一下padding和margin。

盒模型的简单介绍

 

 

【更多内容,欢迎加入交流群565763832与大家一起讨论交流】

【这里是技能树·IT修真院:IT修真院官网,初学者转行到互联网的聚集地】