CSS 盒模型

概述：

CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边框、边距填充和实际内容。（即装东西的容器） 所有HTML标签可以看做盒子，在CSS中，“box model”这一术语是用来设计和布局使用的。(即网页布局 就是利用CSS摆盒子）

内容content

概述：

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

width：

作用：设置宽度

取值：

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

2.  px

3.  百分比

hieght：

作用：设置高度

取值：

1.  auto默认值。浏览器可计算出实际的宽度。
2.  px
3.  百分比

.边框 border

边框是围绕内容和内边距之间的一条或多条线，通过边框属性指定元素的边框宽度、样式和颜色。

border-width 边框宽度

作用：设置所有边框宽度，或者单独的为各边边框设置宽度

取值：长度值