傳統 CSS 使用物理方向（margin-left、margin-top），但在 RTL（右至左）語言或垂直書寫模式下，物理方向與視覺「開始/結束」不一致。CSS 邏輯屬性根據 writing-mode、direction、text-orientation 自動對應正確物理邊界。
| 邏輯屬性 | 對應物理屬性 | 含義 |
|---|---|---|
margin-inline-start (margin-start) | margin-left | 行內軸起始邊距（左） |
margin-inline-end | margin-right | 行內軸結束邊距（右） |
margin-block-start (margin-before) | margin-top | 塊軸起始邊距（上） |
margin-block-end | margin-bottom | 塊軸結束邊距（下） |
padding-inline-start | padding-left | 同理 |
border-block-end-width | border-bottom-width | 同理 |
.box {
margin-inline-start: 20px; /* LTR: 左邊距20px；RTL: 自動變右邊距20px */
margin-block-start: 10px; /* 水平書寫: 上邊距10px；垂直書寫: 自動變左/右邊距 */
}
background-attachment: fixed 背景相對視口固定（視差滾動效果）；scroll（預設）跟隨元素滾動；local 跟隨元素內容滾動。與邏輯屬性無關，屬背景定位範疇。
postcss-logical 自動轉換。國際化專案（阿拉伯語、希伯來語、日文直排）只需切換 dir="rtl" 或 writing-mode: vertical-rl，佈局自動鏡像/旋轉，無需維護雙套 CSS，極大降低維護成本。
邏輯屬性是現代 CSS 佈局國際化的基石，建議新專案優先採用。
