※ z-index：
※三維座標系統，幫助理解螢幕、使用者與空間軸線之間的空間關係
說明：
- X軸（粉紅色）：水平延伸向右，通常代表左右方向。
- Y軸（藍色）：垂直向下，代表上下方向。
- Z軸（綠色）：斜向前方延伸，象徵螢幕之外的深度方向（也就是離視窗使用者的遠近）。
※ z-index 層級規則：
規則一：
.static {
background-color: #adcbc9;
position: relative;
}
<body>
<div class="post relative">relative</div>
<div class="post static">static</div>
</body>
說明：
在HTML中post static比post relative還晚寫，所以套用規則一。
成果顯示：
讓橘色卡片變成上層：
.relative {
background-color: #fdd2b5;
position: relative;
top: 100px;
left: 100px;
/* 高出一層 */
z-index: 1;
}
成果顯示：
※ z-index 屬性：
