Chrome 翻译按钮内“React 18.3”等版本号，因自动翻译不区分语义；须用 <span translate="no">React 18.3</span> 精确控制，且 <html lang="zh-CN" translate="no"> 配合生效。
按钮里写 React 18.3 这类内容为什么会被 Chrome 翻译
Chrome 的自动翻译功能不区分语义，只要看到英文字符串就尝试替换。按钮文字如 Upgrade to React 18.3 里的 React 18.3 一旦被译成“升级到反应 18.3”或“升级到反应十八点三”，开发者一眼就识别失败——版本号的数字和点号是机器可读关键标识，不能动。
translate="no" 必须加在按钮内部的具体元素上
不能只给 <button> 加 translate="no" 就完事。因为按钮内常混排可译文案（如 “Upgrade to”）和不可译专有名词（如 React 18.3），得拆开控制：
- 把专有名词单独包一层
<span>或<code>，再加translate="no" - 例如：
<button>Upgrade to <span translate="no">React 18.3</span></button> - 如果按钮文本全不可译（如
npm install -D vite），整颗<button>加translate="no"也行，但要确认按钮文案本身不需要本地化
input 和 button 的 value 属性不继承 translate
注意：HTML 表单控件的 value 属性（包括 <input type="button"> 和 <button> 的文本内容）**不继承**父级 translate 设置。哪怕整个页面都设了 <body translate="no">，<input value="v5.2.0"> 仍可能被翻。
-
<input type="button" value="Run fetch()" translate="no">——translate="no"必须直接写在<input>标签上 -
<button translate="no">Deploy v5.2.0</button>—— 这里translate="no"生效，因为按钮文本属于元素内容，不是value属性 - 动态渲染的按钮（如 Vue 的
v-for、React 的map）生成后，必须确保每个节点初始 HTML 中已含该属性，JS 后续插入需手动调用el.setAttribute("translate", "no")
lang 属性不配对，translate="no" 就容易失效
Chrome 在语言上下文模糊时会降级处理，忽略 translate="no"。比如中文页面里按钮含英文专有名词，若没声明 lang="zh-CN"，它可能误判为“这是英文页”，进而强行翻译。
立即学习“前端免费学习笔记（深入）”；
- 务必在
<html>标签上同时写：<html lang="zh-CN" translate="no">（仅限初始 HTML，JS 修改无效） - 按钮内嵌的专有名词无需单独写
lang，但外层页面语言声明必须准确 - 验证是否生效：打开 Chrome DevTools → Elements 面板，检查目标
<span>或<button>上是否真实存在translate="no"属性，且没有被 JS 动态移除
translate="no" 不会自动附着，得靠模板逻辑或渲染后脚本补全。 
