dir属性定义文本逻辑书写方向而非仅控制对齐，必须设在上才触发完整rtl行为链；表格单元格需单独设dir；混合文本应使用隔离。
dir 属性不是“让文字右对齐”的样式开关，而是告诉浏览器这段文本的逻辑书写方向——它直接参与 Unicode 双向算法（Bidi），影响光标位置、括号翻转、数字顺序、Tab 焦点流，甚至 flex-direction 的起点。
必须在 dir="rtl" 才算整页 RTL 生效
只给 或某个 <div> 加 <code>dir="rtl"，会导致：
-
<input>和<textarea></textarea>光标仍从左入，退格方向错乱 - Tab 键焦点流不翻转，还是从左到右跳
-
flex-direction: row主轴起点不变，项目仍从左开始排列 - 滚动条卡在右边（而非 RTL 系统应有的左侧）
真正起作用的是 —— 浏览器据此初始化整个文档的 bidi 上下文。别写 ，它不合法，也不触发完整 RTL 行为链。
<td> 和 <code><th> 必须单独加 <code>dir="rtl"
只在 <table> 或 <code><tr> 上设 <code>dir 没用，因为表格行/列容器本身不参与文本排版，方向不继承。
正确做法是直接在单元格上声明：
| مرحبا | Hello |
如果单元格里含 <input>，还得再给它单独加 dir="rtl"，否则输入框内光标和方向仍按文档默认走。
混合文本该用 <bdi></bdi>，别碰 dir="auto"
dir="auto" 看似省事，实际靠首字符判断方向，极易误判：
- 开头是数字（
"123٤٥٦"）、ASCII 字母（"Hello أهلا"）或空格 → 强制 fallback 到ltr - 开头是中文、日文等中性字符 → 同样 fallback 到
ltr，不会识别为 RTL - JS 动态插入后不重算方向，Safari 对带变音符号的阿拉伯字母支持不稳定
API 返回的用户名、搜索词这类不可控内容，应该用 <bdi></bdi> 隔离：
<bdi>{{username}}</bdi>
它创建独立 bidi 环境，避免污染父容器方向，也解决标点重排错误。而 <bdo dir="rtl"></bdo> 会强制把 "123" 显示成 "321"，仅适合调试。
真正难的不是加 dir，而是判断哪一层该继承、哪一层该隔离、哪一层该显式覆盖——多数方向 bug 都出在“以为加了 dir="rtl" 就结束了”，结果阿拉伯语里的英文 URL 被拆成两行还反向换行，或者表单光标还在左边。
