流相對值
在 CSS 中,流相對值是相對於元素的塊軸和內聯軸的定向關鍵字值。這些值包括 block-start、block-end、inline-start、inline-end、start 和 end。
在 CSS 中,物理屬性根據物理方向定義位置,並引用元素的特定側面。
另一方面,CSS 邏輯屬性根據文件的書寫模式和方向而非視口的物理尺寸定義樣式。邏輯屬性相對於內容流,並使用相對於塊軸和內聯軸的定向關鍵字。
塊方向
塊軸是指在塊佈局中定義元素堆疊順序的軸。它本質上是網頁上內容塊(如段落 (<p>)、標題和 div (<div>))排列的方向。這也被稱為塊方向。在從左到右和從右到左的語言中,塊方向是內容流的垂直方向,從上到下。
塊開始和塊結束方向分別表示沿塊軸的內容的起始邊緣和結束邊緣,或“從”和“到”方向,其中 block-start 相當於水平書寫模式中的 top,block-end 相當於 bottom。
行內方向
內聯軸垂直於塊軸。內聯軸表示文字等內聯內容在塊內流動的方向。這也被稱為內聯方向。在從左到右的書寫模式中,如英語,內聯方向是水平的,從左到右。在從右到左的語言中,如阿拉伯語和希伯來語,內聯方向是水平的,從右到左。
內聯開始和內聯結束分別表示沿內聯軸的內容的起始邊緣和結束邊緣,其中值和屬性 inline-start 和 inline-end 相當於水平書寫模式中的 left 和 right 屬性和值。它們是等同於 right 還是 left 取決於書寫方向。例如,在從左到右的語言中,inline-start 等同於 left;在從右到左的語言中,它等同於 right。
開始和結束
CSS 屬性的效果可以是一維或二維的。例如,text-align 只涉及文字的內聯方向,因此是一維的。當在上下文中限制為一維時,流相關關鍵字縮寫為 start 或 end。