CSS样式：盒子模型

一、盒子模型的特性

1外边距(margin)：盒子与其他元素之间的额距离
       
 2内边距(padding)：也称为填充距离,内容和边框之间的距离
       
 3边框(border)：内边距和外边距的分界线，可以为0

二、盒子模型的相关属性

1.边框属性

边框线样式	border-style	上边 [右边 下边 左边]
边框线宽度	border-width	上边 [右边 下边 左边]
边框线颜色	border-color	上边,[右边,下边,左边]
综合设置	border	四边宽度 四边样式 四边颜色;
圆角边框	border-radius	水平半径参数/垂直半径参数;
图片边框	border-images	图片路径 裁切方式/边框宽度/边框扩展距离 重复方式;

2.内边距属性：

 padding-top: 上边距
 padding-right:右边距
 padding-bottom:下边距
 padding-let:左边距
 padding: 设置顺序（上 右 下 左）
 注意：
 不能有负值 不能同时设置相对的两个边距

3.外边距属性：

margin-top：上边距

margin-right:右边距
margin-bottom:下边距
margin-left:左边距
margin:设置顺序（上 右 下 左）

4.背景属性

背景颜色	background-color	rgb&rgba
背景图像	background-image	url（图片路径）
背景图像的平铺属性	background-repeat	repeat：默认值,表示沿水平、垂直方向平铺  no-repeat：不平铺,只显示一张图片  repeat-x：沿水平方向平铺  repeat-y：沿垂直方向平铺
背景图像的位置属性	background-position
背景图像的固定属性	background-attachment	scroll：默认值,背景图像会随内容一起滚动   fixed：背景图像位置固定不动

综合设置：
background:背景色 url("图像") 平铺 定位 固定;
盒子的总宽度= width+左右内边距之和+左右边框宽度之和+左右外边距之和

盒子的总高度= height+上下内边距之和+上下边框宽度之和+上下外边距之和

5.阴影属性：
        

box-shadow:水平阴影位置 垂直阴影位置 模糊距离 阴影尺寸 颜色 outset/inset