愛算牌的部落格

<style>
.position_static {border:1px solid;}
.position_relative {
position:relative;
border:1px solid;
top:50px;
left:150px;
}
.position_fixed {
position:fixed;
border:1px solid;
}
.position_absolute {
position:absolute;
border:1px solid;
top:0px;
right:0px;
}
.position_sticky {
position:sticky;
border:1px solid;
top:0px;
}
</style>
<div class="position_static">static 預設值靜態不受top、left、right、mottom等位移影響</div>
<div class="position_relative">relative 相對位置可位移</div>
<div class="position_fixed">fixed 即使頁面滾動依舊固定不動</div>
<div class="position_absolute">absolute 絕對位置 可以到處跑 參考點是整個頁面</div>
<div class="position_sticky">sticky 黏貼 會隨頁面滾動但不會消失於視野</div>