dir="auto"不可靠，仅适用于用户昵称等低风险内联文本；它依赖首字符强方向性，遇ascii字母、数字、空格、中日韩文字或js动态插入时均fallback至ltr，safari对变音符号识别也不稳定；关键路径必须显式设dir="ltr"/"rtl"，混排内容应使用隔离。
dir="auto" 不可靠，线上关键路径别用它。
什么时候 dir="auto 会判错方向
它只看第一个强方向字符（如阿拉伯字母、希伯来字母），其余情况一律 fallback 到 ltr：
- 开头是 ASCII 字母、数字或空格（如
"Hello"、"123 أهلا"、" مرحبًا"）→ 强制ltr - 首字符是中文、日文、韩文等中性文字 → 同样 fallback 到
ltr，不会触发 RTL - JS 动态插入内容（如
el.innerHTML = apiResponse）后，方向不重算，首字符若为空或标点就锁死错误方向 - Safari 对带变音符号的阿拉伯字母（如
إ、ؤ）识别不稳定，Chrome 和 Firefox 表现也可能不一致
<bdi></bdi> 才是混排文本的正确解法
当内容来自 API、方向不可控且可能混排（比如阿拉伯用户名里夹英文、URL 或数字），必须用 <bdi></bdi> 包裹：
-
<bdi></bdi>隐式启用 Unicode 双向隔离（unicode-bidi: isolate），防止外部方向污染 - 不用再写
dir="auto"——<bdi></bdi>本身已等价于dir="auto"+ 隔离，显式加反而冗余甚至有害 - 对比：
<span dir="auto">مجلد.txt</span>可能让点号被拉进 RTL 上下文；<bdi>مجلد.txt</bdi>能正确隔离，保持扩展名逻辑顺序
根元素方向必须显式声明，不能靠 auto
整页 RTL 必须从 开始设 dir="rtl"，而不是依赖 dir="auto" 或只在 上设：
-
才能让<input>光标起始位置、Tab 焦点流、flex 主轴起点、滚动条位置等全部按 RTL 逻辑生效 -
是无效写法，dir属性必须作用于文档根元素 -
会被忽略——不支持auto值，浏览器直接 fallback 到默认ltr
真正容易被忽略的是：方向控制不是视觉对齐问题，而是底层文本逻辑。一旦漏掉 或误用 dir="auto" 在关键文案上，后续所有样式和 JS 都救不回来。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
