CSS

一，盒子模型：

1，border：

          （1  border-width: 5px;

         （2   border-style: solid;实线

dotted : 　点线。dashed : 　虚线。
solid : 　实线边框

          （3  border-color: aqua;

简写：border：5px，solid，pink；不分顺序

 (4，表格细线边框:   border-collapse: collapase

(5,边框会影响盒子实际大小

2，内边距padding：

padding-top/bottom/left/right：

简写：

注意： 

如果 盒子本身没有指定width/height属性，则此时padding不会撑开盒子大小

3，外边距margin：

margin-left/right/top/bottom：

margin的简写与padding一样

典型应用：让块级盒子水平居中，但必须满足2个条件： 

（1，盒子必须指定了宽度width

（2，盒子左右的外边距都设置为auto   margin：0 auto；

外边距合并：

（1，

（2， 

3，清除内外边距：

不同浏览器的默认内外边距不同

二，PS基本操作：

三，圆角边框（重点）

四，盒子阴影（重点）

五，文字阴影

六，CSS浮动：

1，传统网页布局

2，为什么需要浮动

3，什么是浮动？

4，浮动特性（重难点！！！）

(1,浮动元素会脱离标准流（脱标）

（2，浮动元素会一行内显示并且元素顶部对齐

    一行内装不下会自动换行

     浮动的元素之间不会有缝隙

（3，浮动元素会具有行内块元素的特性（重难点）

5，浮动元素经常和标准流父级搭配使用

6，浮动的两个注意事项：

7，清除浮动：

（1，为什么需要清除浮动？

（2，清除浮动的本质

（3，语法：

选择器 {clear：属性值；}

属性值：left（不允许左侧有浮动元素，清除左侧浮动的影响），right，both

实际工作中，几乎只用clear：both；

清除浮动的策略是：闭合浮动，只让浮动在父盒子内部影响，不影响父盒子外面的其他盒子

8，清除浮动的方法：

（1，额外标签法即隔墙法，W3C推荐的做法

 

（2，父级添加overflow属性

（3，父级添加after属性

.clearfix:after {
        content: '';
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }
    .clearfix {
        /* 为 IE6、IE7浏览器设置的清除浮动 */
        *zoom: 1;
    }

（4，父级添加双伪元素