css定位布局

定位布局

定位元素的特点：
    1.【绝对定位、固定定位】脱离文档流(1.宽高如果没有指定，由其内容决定；2.元素脱了文档流后不占据屏幕空间，其下面的块元素就会顶上来)
    2.所有定位元素都可以使用如下属性
    left/right/bottom/top
    3.position的取值决定了相对点
position:static;(非定位元素)

position:relative;    相对定位元素
    不脱离文档流
    相对于其当前所在位置
    一般情况下的相对定位不会让他发生移动，而是作为决定定位的参照物

position:absolute;    绝对定位元素
    脱离文档流
    相对于距离他最近的父定位元素(relative、absolute、fixed)，如果所有父元素都不是定位元素，那么就相对于浏览器视口

position:fixed;    固定定位元素
    脱离文档流
    相对于浏览器视口
    不会随着浏览器的滚动而滚动
position:sticky;top:10px;    粘滞定位元素
    不脱离文档流
    是相对定位和固定定位的一种结合，当没有超过阈值的时候为相对定位，超过阈值为固定定位。
    
<style>
    .one{
        positon:static;
    }
</style>
<div class="one"></div>