/* 相对定位，没有脱离文档流，会给他预留空间，受 top，left 等影响 */
.element {
    position: relative;
    top: 20px;
    left: 20px;
}

/* 绝对定位，脱离文档流，不会给他预留空间，受 top，left 等影响 */
.element {
    position: absolute;
    top: 20px;
    left: 20px;
}

/* 固定定位，脱离文档流，不会给他预留空间，受 top，left 等影响，但是相对于浏览器窗口 */
.element {
    position: fixed;
    top: 20px;
    left: 20px;
}

/* 粘性定位，脱离文档流，不会给他预留空间，受 top，left 等影响，但是相对于浏览器窗口 */
.element {
    position: sticky;
    top: 20px;
    left: 20px;
}