HTML5-8(盒子模型)

盒子模型

一.简单的介绍下盒子模型

网页上的每一个标签都是一个盒子,每个盒子都有四个属性

• 1.内容（content）

  盒子里装的东西
  网页中通常是指文字和图片

• 2.填充（padding，内边距）

  怕盒子里装的（贵重的）东西损坏，而添加的泡沫或者其它抗震的辅料

• 3.边框（border）：盒子本身

• 4.边界（margin，外边距）

  盒子摆放的时候的不能全部堆在一起，盒子之间要留一定空隙保持通风，同时也为了方便取出

下面是一个标准的盒子模型

标准的盒子模型

下面是IE盒子模型

下面是IE盒子模型

二.内容（content）属性

内容（content）属性

三.填充（padding，内边距） – 属性

填充（padding，内边距） – 属性

padding属性的解释

例如下面的分析

padding的分析

四.边框（border） –属性

边框（border） –属性

五.边界（margin，外边距） –属性

边界（margin，外边距） –属性**

margin属性的解释

例如:

边界（margin，外边距） –属性