CSS定位

定位：是一种布局手段，而且它是一种高级的布局手段，

      可以将页面中的任何元素放在页面中的任意位置

     通过position属性进行设置，

       可选值：

          static    默认值   不开启定位

          以下四种都属于开启定位

          relative  开启相对定位

          absolute  开启绝对定位

          fixed     开启固定定位

          sticky    开启粘滞定位

    掌握定位：如何开启、开启后的特点

    相对定位

    使用position：relative；开启  

    特点：    

      1、开启了相对定位，如果不配合偏移量使用，元素不会发生任何变化

      2、相对定位，是相对于元素原来在文档流中的位置定位

      3、开启了相对定位后，元素的层级会变高，也就是会盖住其他的元素

      4、开启了相对定位后，元素的性质不会发生变化，

            也就是块还是块，行内还是行内

偏移量  相对于定位位置挪动的大小的值

       left   相对于定位位置左侧的偏移量

       right   相对于定位位置右侧的偏移量

       top    相对于定位位置上侧的偏移量

       bottom  相对于定位位置下侧的偏移量

       一般情况下，设置偏移量，

              水平方向，left或right调动一个值

              垂直方向，top或bottom调动一个值

绝对定位：

      开启绝对定位

        position：absolute；

      开启后特点

        1、开启了绝对定位，如果不配合偏移量使用，元素的位置没有发生变化

        2、开启了绝对定位后，元素会脱离文档流，下面的元素就会跑上去

        3、开启了绝对定位，元素脱离文档流，元素的性质就会发生变化

          不再区分块还是行内还是行内块，也就是块元素不会独占一行了，行内元素可以设置宽高等等

        4、绝对定位的原点，是相对于其包含块来确定的

            一般情况下，如果设置子元素为绝对定位，

            我们会同时设置其父元素相对定位，以便设置偏移量，这种情况叫“子绝父相”，

            但最终还是要根据如何方便设置子元素偏移量为准。

        5、开启了绝对定位，元素会提升一个等级

    包含块：

        1、在没有定位的情况下，其包含块就是其父元素或祖先元素

        2、在开启了定位的情况下，其包含块就是离它最近开启了定位的祖先元素，

        如果其祖先元素都没有开启定位，包含块就是根元素（html标签）