direction 文本方向属性

最后更新：2026-09-13

direction direction 文本方向属性

direction 属性用于设置文本的书写方向，支持从左到右（ltr）和从右到左（rtl）两种模式。它主要影响阿拉伯语、希伯来语等从右到左书写的语言，同时也会改变文本对齐、滚动条位置和布局流向。对于多语言网站，通常建议在 HTML 标签上使用 dir 属性而非 CSS。

direction: ltr | rtl;

值	类型	描述
`ltr \| rtl`	关键字	文本方向

编辑下方代码，在 playground 中查看实时效果：

浏览器	Chrome	Edge	Firefox	Safari	Opera
direction	✓ v10	✓ v12	✓ v1	✓ v1	✓ v1
所有主流浏览器均支持

提示： 对于 RTL 语言，建议在 HTML 标签上直接使用 dir="rtl" 属性，语义更清晰，且能自动影响整个文档流。

重要： direction 会改变 margin、padding 等逻辑属性的物理方向，配合 CSS 逻辑属性（如 margin-inline-start）可实现更好的国际化支持。

Qdirection 和 writing-mode 有什么区别？

Adirection 控制文本的书写方向（左右流向），writing-mode 控制文本的整体排版方向（水平或垂直）。两者可以组合使用，实现不同的排版效果。

Q设置 direction: rtl 后为什么布局变了？

Adirection: rtl 会改变文本流向，导致文本从右侧开始排列，滚动条也会移到左侧。如果只想改变文本对齐而不影响布局，建议使用 text-align。

Q阿拉伯语或希伯来语网页怎么设置从右到左？

A在 <html> 或 <body> 标签上写 dir="rtl"，比 CSS 的 direction: rtl 更语义化，还能同时影响表单、滚动条等浏览器行为。CSS 中可写 direction: rtl，配合 unicode-bidi 处理混合文本。

Web-Tutorial 技术团队

由多位开发者共同维护的编程教程平台。每篇教程由对应领域的开发者编写和审核，确保内容准确可靠。如发现任何问题，欢迎向我们反馈。