一.浮动
    1.浮动的书写:
    float:left;
    float:right;
    2.特点：
    1）具有盒模型所有属性
    2）浮动标签会被文字自然包围起来
    3）浮动标签碰到任何东西都会停止
    4）浮动标签不与普通标签产生碰撞关系，普通标签会被压在浮动标签之下
    解决方式：需要在普通标签上使用clear:both;
    5）浮动标签垂直方向外边距不会合并
    6）后面的普通标签想与浮动标签产生距离，需要在浮动标签上加margin
    7）解决普通标签包裹不住浮动标签的问题
    解决方式1：在父标签下建立空间标签
    然后给这个新空间clear:both;

    解决方式2: 在父标签起个clearfix名字
    .clearfix:after{
    content:””; <—-添加内容
    height:0; <—-高度设为零
    display:block; <—-变成块级标签
    overflow:hidden; <—-隐藏超出内容
    clear:both; <—-去浮动
    }

    二.定位
    1.相对定位：灵魂出窍式的移动，仪表前四个角为基准点进行移动。
    书写 ：position:relative；配合方向使用top/bottom/left/right
    特点：
    1）不改变原本的标签类型，只是在原有的基础上的标签上添加了移动的特性。
    2）移动出去的内容不占空间，有定位的声明的标签会压在没有定位的标签上，当两个标签同时含有相对定位的声明属性时，后面的会压住前面的，如果更自由的调整覆盖顺序，我们可以设置权重值。

    2.绝对定位：羽化升仙式的移动，以浏览器四个角为基准点进行移动。
    书写 ：position:absolute；配合方向使用top/bottom/left/right
    特点：
    1）有绝对定位的声明的标签脱离了普通标签的文档类型变成绝对文档类型。
    2）支持盒模型。
    3）完全不占空间
    3.相对定位中的绝对定位
    使用方法：
    1）给移动的标签绝对定位
    2）给它移动范围的空间标签加相对定位
    4.粘性定位
    使用方法：
    1）给其需要粘性定位的标签使用position：sticty；top=0；
    2）为了避免内容有覆盖问题配合z-index：999；
    5.固定定位：
    书写：position：fixed；
    常用于浏览器上的小广告