2023-07-29T08:40:20.png

relative相对定位

只有一个层,不会与同相对定位的元素覆盖
随滑动网页移动位置
2023-07-29T08:08:30.png

.ssw{
    width: 500px;
    height: 200px;
    background-color: pink;
    position: relative;

}

absolute绝对定位

每个绝对定位都是一个新的层
随滑动网页移动位置
2023-07-29T08:08:33.png

  .ss{
        width: 200px;
        height: 200px;
        background-color: green;
        position: absolute;
        left: 550px;
        top:200px;


    }

fixed固定定位

position:fixed;
滑动网页位置仍然不变

.gg{
    width: 200px;
    height: 200px;
    background-color: orange;
    position:fixed;
    right: 30px;
    top:100px;


}

screenshots.gif