CSS盒子模型

企业建站必须是能够以充分展现企业形象为主要目的，是企业文化与产品对外扩展宣传的重要窗口，一个合格的网站不仅仅能为公司带来巨大的互联网上的收集和信息发布平台，创新互联公司面向各种领域：纱窗等网站设计、全网营销推广解决方案、网站设计等建站排名服务。

1   盒子的组成包括

   margin外边距、border边框、padding内边框和content内容

2   正文框的最内部分是实际的内容，直接包围内容的是内边距，内边距呈现了元素的背景，内边距的边缘是边框，边框以外是外边距，外边距默认是透明的，因此不会遮挡其后的任何元素

3   内边距、边框和外边距都是可选的，默认值是零，外边距可以是负值

4   宽度width和高度height指的是内容区域的宽度和高度，增加内边距、边框和外边距不会影响内容区域的尺寸，但是会增加元素框的尺寸

5  CSS盒子模型的内边距

   内边距在正文content外，边框border内，控制该区域的最简单的属性是padding属性，padding属性定义元素边框与元素内容之间的空白区域，可以进行统一的内边距设置，也可以进行单边的内边距设置

6   css padding属性定义元素的内边距，padding属性接受长度值或百分比值，但不允许使用负值

   可以按照上、下、左、右的顺序分别设置各边的内边距，各边均可以使用不同的单位或百分比值

7   设置数值时，常用的单位有像素px和厘米cm

8   设置内边距的常用属性

属性	描述
padding-top	设置顶部属性
padding-right	设置右侧属性
padding-bottom	设置底部属性
padding-left	设置左侧属性

9   CSS盒子模型的边框

   元素的边框border是围绕元素内容的内边距的一条或多条线

   设置border属性可以规定元素边框的样式、宽度和颜色

10   在html中是使用表格来创建周围的边框

11   在css中是通过边框属性来创建出效果出色的边框，并且可以应用于任何元素

12   使用border-color属性来设置边框属性，它一次可以接受最多四个颜色值，分别是边框的四边，可以使用任何类型的颜色值，可以是命名颜色，也可以是十六进制和RGB值

13   css盒子模型的边框

属性	描述
border-top-color	设置顶部颜色属性
border-left-color	设置左侧颜色属性
border-bottom-color	设置底部颜色属性
border-right-color	设置右侧颜色属性

14   盒子模型的外边距

   外边距就是围绕在内容框的区域，默认为透明的区域

    外边距也接受任何长度的单位，百分数与内边距很相似

    使用任何一个属性来只设置相应的外边距，不会直接影响所有其他外边距

15   设置外边距的常用属性

属性	描述
margin-top	设置顶部的外边距
margin-bottom	设置底部的外边距
margin-right	设置右侧的外边距
margin-left	设置左侧的外边距

16   morgin的默认值是零，如果没有为margin声明一个值，就不会出现外边距

17   对称复制

   如果缺少左外边距的值，则是用右外边距的值

   如果缺少下外边距的值，则使用上外边距的值

   如果缺少右外边距的值，则使用上外边距的值

网站标题：CSS的盒子模型
文章分享：http://chengdu.cdxwcx.cn/article/jcghsg.html