CSS盒子模型

一、边框

1、边框属性

border-style 边框的样式 ：solid实线边框 dashed虚线边框 dotted点线边框
border-width 边框粗细 一般用px
border-color 边框颜色

2、边框复合写法

border:1px solid red; 没有顺序

3、表格的细线边框

border-collapse:collapse; 相邻边框合并

二、内边距

padding 边框和内容之间距离

1、内边距复合写法

padding：
一个值:上下左右
两个值:上下 左右
三个值:上 左右 下
四个值:上 右 下 左

注意：盒子没有width和height属性，padding不影响盒子大小

三、外边距

margin

1、外边距复合写法

和内边距相同

2、外边距让块级盒子水平居中条件:

1、盒子必须指定宽度
2、盒子左右的外边距设为auto

注意：行内元素或行内块元素水平居中给其父元素添加text-align:center

3、嵌套块元素垂直外边距的塌陷

解决方案:
1、给父元素定义上边框
2、给父元素定义上内边距
3、给父元素添加overflow:hidden（常用 不影响盒子大小)

注意：行内元素尽量只设置左右内外边距