学编程的第八天

盒子模型（box model）
买个冰箱 收到一个的快递
冰箱 内容区（content）
纸箱子 边框（border）
泡沐 内边距（padding）
冰箱离你的距离 外边距（margin）
影响盒子大小的元素：内容区，边框，内边距 ，外边距不影响盒子的大小
1.内容区(content) 元素中所有的子元素和文本内容都在内容区中排列
width 设置内容区的宽度
height 设置内容区的高度
2:边框（border）元素设置边框
边框属于盒子边缘，边框里面属于盒子内部，出了边框都是盒子的外部
设置边框必须指定三个样式 分别是颜色，大小，样式
border-color: ; 设置边框的颜色
1、有默认值，默认颜色是黑色
2、可以写多个颜色 以空格隔开
4个 上 右 下 左
3个 上 左右 下
2个 上下 左右
1个 上下左右
3、border-xxx-color 特指top right bottom left某一边颜色
border-width: ; 设置边框的大小
1、默认值 默认值大概1-3px
2、也可以跟多个值 以空格隔开
4个 上 右 下 左
3个 上 左右 下
2个 上下 左右
1个 上下左右
3、border-xxx-width 特指top right bottom left某一边宽度
border-style: ; 设置边框的样式
1、默认值 none
2、solid 实线
dashed 虚线
dotted 点状虚线
double 双线
border简写
border:颜色，大小，样式;
border-top:颜色，大小，样式;
border-right:颜色，大小，样式;
border-bottom:颜色，大小，样式;
border-left:颜色，大小，样式;
内边距（padding）指的是内容区和边框之间的距离
padding-top 上内边距
padding-right 右内边距
padding-bottom 下内边距
padding-left 左内边距