流相对值

在 CSS 中,流相对值是相对于元素的块轴和内联轴的定向关键字值。这些值包括 block-startblock-endinline-startinline-endstartend

在 CSS 中,物理属性根据物理方向定义位置,并引用元素的特定侧面。

另一方面,CSS 逻辑属性根据文档的书写模式和方向而非视口的物理尺寸定义样式。逻辑属性相对于内容流,并使用相对于块轴和内联轴的定向关键字。

块方向

块轴是指在块布局中定义元素堆叠顺序的轴。它本质上是网页上内容块(如段落 (<p>)、标题和 div (<div>))排列的方向。这也被称为块方向。在从左到右和从右到左的语言中,块方向是内容流的垂直方向,从上到下。

块开始块结束方向分别表示沿块轴的内容的起始边缘结束边缘,或“从”和“到”方向,其中 block-start 相当于水平书写模式中的 topblock-end 相当于 bottom

行内方向

内联轴垂直于块轴。内联轴表示文本等内联内容在块内流动的方向。这也被称为内联方向。在从左到右的书写模式中,如英语,内联方向是水平的,从左到右。在从右到左的语言中,如阿拉伯语和希伯来语,内联方向是水平的,从右到左。

内联开始内联结束分别表示沿内联轴的内容的起始边缘结束边缘,其中值和属性 inline-startinline-end 相当于水平书写模式中的 leftright 属性和值。它们是等同于 right 还是 left 取决于书写方向。例如,在从左到右的语言中,inline-start 等同于 left;在从右到左的语言中,它等同于 right

开始和结束

CSS 属性的效果可以是一维或二维的。例如,text-align 只涉及文本的内联方向,因此是一维的。当在上下文中限制为一维时,流相关关键字缩写为 startend

另见