此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。
direction
Baseline Widely available *
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.
* Some parts of this feature may have varying levels of support.
direction CSS 属性用于设置文本、表格列和水平溢出的方向。对于从右到左书写的语言（如希伯来语或阿拉伯语），应将该属性设置为rtl；对于从左到右书写的语言（如英语和大多数其他语言），则应将该属性设置为ltr。
尝试一下
direction: ltr;direction: rtl;<section> <div> <div>1</div> <div>2</div> <div>3</div> <div>4</div> </div></section>#example-element { border: 1px solid #c5c5c5; padding: 0.75em; width: 80%; max-height: 300px; display: flex;}#example-element > div { background-color: rgba(0, 0, 255, 0.2); border: 3px solid blue; margin: 10px; flex: 1;}请注意，文本方向通常在文档中定义（例如，使用HTML 的dir 属性 属性），而不是通过直接使用direction 属性来定义。
该属性设置可以设置块级元素文本的基本方向，也可以设置由通过unicode-bidi 属性创建的嵌入元素的方向。与此同时，它还可以设置文本、块级元素的默认对齐方式，以及表行中的单元格的流动方向。
与 HTML 中的dir 属性不同，direction 属性不会从表列继承到表单元格，因为 CSS 继承遵从文档流，而表单元格位于行内部，但不在列内部。
direction 和unicode-bidi 属性是唯二不受all 简写属性影响的属性。
语法
/* 关键字值 */direction: ltr;direction: rtl;/* 全局值 */direction: inherit;direction: initial;direction: revert;direction: revert-layer;direction: unset;取值
要使direction 属性在行级元素上生效，unicode-bidi 属性的值必须是embed 或override。
形式定义
形式语法
direction =
ltr|
rtl
示例
设置从右往左的方向
在下面的例子中有两个文本字符串，都使用direction: rtl 来显示。尽管这种设置可以正确显示阿拉伯文本，但中文内容却有一个标点符号在一个不寻常的位置。
blockquote { direction: rtl; width: 300px;}<blockquote> <p>这个段落用中文书写的，但是方向是从右到左，是错误的。</p></blockquote><blockquote> <p>هذه الفقرة باللغة العربية ، لذا يجب الانتقال من اليمين إلى اليسار.</p></blockquote>规范
| Specification |
|---|
| CSS Writing Modes Level 4 # direction |
| Scalable Vector Graphics (SVG) 2 # DirectionProperty |
浏览器兼容性
参见
unicode-bidiwriting-mode- HTML 的
dir全局属性