css（3）

1.盒子模型 内容区域

width 宽度

height 高度

内容溢出内容区别

overflow     overflow-x     overflow-y

visible 默认 溢出部分 可见  

hidden 溢出部分 隐藏

scroll 显示滚动条

auto 浏览器自动处理

2.内边距 paading

padding-top 上内边距

padding-bottom 上内边距

padding-left 上内边距

padding-right 上内边距

简写形式：1.padding：值1 四周

                  2. padding：值1 值2；
                   值1是上，下内边距

                   值2是左，右内边距

                   3.padding：值1 值2 值3
                   值1：上内边距
                   值2：左，右内边距
                   值3：下内边距

                  4. padding：值1 值2 值3 值4
                   值1：上
                   值2：右
                   值3：下
                   值4：左
                   上右下左顺时针方向

3.边框 border

1.border-width 边框宽度

2.border-color 边框颜色

3.border-style 边框样式

1. none 无样式
2. solid 实线
3. dashed 虚线
4. dotted 点状线
5. double 双实线

 简写：border：border-width值 border-color值 border-style值

注意：三个值没有先后顺序，中间用空格隔开

rgba()不透明度

border-top 上边框

border-bottom 下边框

border-left 左边框

border-right 右边框

 4.外边距 margin

margin-top 上外边距

margin-bottom 下外边距

margin-left 左外边距

margin-right 右外边距

简写：

margin：值1

margin：值1 值2；

margin：值1 值2 值3；

margin：值1 值2 值3 值4；

补充

BFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。 

块元素水平居中 

margin：0 auto；

5.display 

block“块”元素

inline“行内”元素

inline-block  行内块元素

none 隐藏