bdo 标签仅重排字符视觉顺序而非镜像字形，它绕过unicode双向算法按dir属性强制逐字符绘制，不改变原始文本内容，复制粘贴仍为原序，且影响可访问性朗读顺序。
bdo 标签不能实现“镜像文字”（即字形左右翻转），它只做字符级视觉顺序重排；所谓“倒过来显示”，本质是按 dir="rtl" 强制从右到左逐字符绘制，不是图形翻转，也不生成新字符。
为什么 bdo 不是镜像，只是重排
bdo 绕过 Unicode 双向算法（UBA），直接按 dir 指定方向把 DOM 文本节点里的每个字符“从右往左”或“从左往右”挨个画出来。它不调用任何字体镜像、CSS 变换或 Unicode 控制符。
常见错误现象：
-
<bdo dir="rtl">Hello</bdo>显示为olleH，但复制粘贴出来仍是Hello -
<bdo dir="rtl">abc123</bdo>渲染为321cba，数字和字母一起被翻，不是“仅字母倒序” - 对中文、日文等弱方向性文字，
dir="rtl"同样会强制重排：如<bdo dir="rtl">你好</bdo>显示为好你（非字形翻转）
bdo 必须显式写 dir，且只认 "ltr" 和 "rtl"
不写 dir 属性，bdo 完全无效——浏览器静默忽略，不会继承父元素的 dir，也不会 fallback 到 ltr 或 auto。
必须注意：
-
dir值大小写敏感：DIR="RTL"在 XHTML 或严格解析环境下可能被拒 -
dir="auto"对bdo无效，浏览器会忽略或降级为ltr，导致阿拉伯语、希伯来语直接乱码（如<bdo dir="auto">שלום</bdo>显示为םולש） - 不要混用：
<bdo dir="rtl"><span dir="ltr">URL</span></bdo>不会“保内层方向”，整个 span 会被外层rtl一起翻
什么场景真该用 bdo，什么场景该停手
bdo 是调试/教学工具，不是 UI 实现手段。日常开发中绝大多数“想让文字倒着看”的需求，其实错判了问题本质。
必须用 bdo 的极少数情况：
- 调试双向文本异常：比如验证某段英文 URL 是否被 RTL 容器意外重排，用
<bdo dir="rtl">https://a.com</bdo>快速确认是否真倒序 - 演示
unicode-bidi: bidi-override的纯视觉效果（教学或测试） - 终端模拟器中控制光标移动方向：需让键盘 ← 键从右往左跳字符，仅靠
dir或bdi无法做到
以下情况请立刻停手，改用其他方式：
- 用户昵称含阿拉伯字母 + 数字（如
أحمد123）→ 用<bdi></bdi>隔离，而非<bdo dir="rtl"></bdo>，否则变成321أحمد - 整段多语言混排内容（含括号、链接、标点）→
bdo会破坏语义配对，改用dir属性或 CSSdirection - 需要真正“左右翻转字形”（如把汉字“中”画成镜像图形）→ 必须用
CSS transform: scaleX(-1)或 SVG，bdo做不到
嵌套 bdo 和可访问性风险
嵌套 bdo 会导致方向叠加，渲染结果难预测。例如：
<bdo dir="rtl">a1<bdo dir="ltr">b2</bdo>c3</bdo>
浏览器先对外层整体 RTL 翻转，再对内层 bdo 再次 LTR 翻转，最终顺序取决于字符类型和浏览器实现，不同环境可能不一致。
更关键的是可访问性：
- 屏幕阅读器（VoiceOver/TalkBack）会按
dir指定的方向朗读，不是按视觉顺序，也不是按 DOM 顺序 -
<bdo dir="rtl">123</bdo>会被读作 “3 2 1”，而非 “123” - 复制粘贴、JS 获取
textContent、服务端解析，全部仍是原始字符串，UI 和逻辑完全脱节
真正容易被忽略的点是：它看起来“生效了”，但所有后续交互（选中、光标定位、AT 朗读、正则匹配）都还在原始顺序上运行——这不是 bug，是设计使然。用之前，得先问清楚：你到底要改“人眼看到的顺序”，还是“机器处理的顺序”。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
