解决高度塌陷

解决高度塌陷

    清除浮动：将最后一个盒子设为空白盒子再clear：both；就可以撑开父元素，防止高度塌陷

    用after在后面加入内容，为兼容ie6需加zoom  eg：.clearfix：after{content："";display：block；clear：both；}

                                                  .clearfix{zoom：1；}  【最推荐使用】

定位：元素开启定位后比文档流高一层

        position：

                  static：默认值，没有定位

                  relative：{position：relative；left：100px；top：200px；}

            相对定位相对于元素在文档流原来的位置

            开启相对定位后不会影响元素性质

                  absolute：元素相对于html元素或离他最近 的祖先定位元素进行定位（一般帮他的父元素先开启相对定位）

    绝对定位，会使元素完全脱离文本流

    开启绝对定位后会影响元素性质

    绝对定位的块元素的宽度会被其内容撑开

                  fixed：固定定位，元素会被锁定在屏幕的某个位置上，网页滚动时保持不动

                  （开启以上三种定位后可使用（top、right、bottom、left）属性）

        z-index：元素开启定位后可使用，可提升定位元素所在的层级

                  可指定一个整数作为参数，值越大优先级越高，显示在网页上层

  未开启定位则不可以使用

opacity：设置透明，0为完全透明，1为完全不透明；

filter：alpha（opacity=50）：一般也会加上这个滤镜用于支持ie浏览器（选值0~100）

background-image：url（图片路径）

一般设置背景图片时同时指定背景颜色

background-repeat：设置是否重复背景图

                  repeat  重复图片

                  no-repeat  不重复，只一张

                  repeat-x  只横排重复

                  repeat-y  只竖排重复

background-position：设置背景图像的起始位置 

    eg：background-position：bottom center；可选值一个设为横，一个为竖 

    eg：background-position：100px 200px；

background-attachment：设置背景图片是否会随着页面其余部分的滚动而滚动

小注意点：如父子元素则子元素永远在父元素之上

  相对路径写到哪儿便从哪儿开始找