css盒模型

1、概述

CSS盒模型本质上是一个盒子，封装周围的 HTML 元素，它包括：边距、边框、填充、和实际内容。（即装东西的容器）

所有 HTML 标签可以看作盒子，在 CSS 中，"box model" 这一术语是用来设计和布局时使用的。（即网页布局就是利用 CSS 摆盒子）

2、内容 content

概述：CSS通过为元素设置width和height属性值来规定元素的content内容区域的大小。 元素的内容及子元素默认从内容区域开始排列。

2.1、width

• 作用：设置宽度

• 取值

  • auto默认值。浏览器可计算出实际的宽度。

  • px

  • 百分比

2.2、height

• 作用：设置高度

• 取值

  • auto默认值。浏览器可计算出实际的宽度。

  • px

  • 百分比