translate="no"是阻止浏览器自动翻译技术内容最轻量可靠的方式，它仅控制翻译开关，与i18n无关；lang声明语言归属但不控制翻译；需显式并用lang和translate；技术标识符、命令、路径等必须加，UI文案则不应加；不可全局设于<html>；<textarea>、<input>及v-html内容需单独处理。
直接加 translate="no" 是阻止浏览器自动翻译技术内容最轻量、最可靠的方式，但它和语言本地化（i18n）完全无关——它不触发翻译，也不参与任何语言包加载或文案替换逻辑。
translate="no" 和 lang 属性混用时为什么常出错
很多人误以为 lang="en" 就等于“这段不用翻”，结果 React 被 Chrome 翻成“反应”。lang 只声明当前文本的语言归属，不影响翻译行为；translate 才是真正开关。正确写法必须显式并存：
<div lang="en" translate="no">useState</div>-
<span lang="zh-CN" translate="yes">提交</span>（仅当父级设了translate="no"且你希望此处破例可译） - 第三方组件库（如 Ant Design）输出的 DOM 可能自带
translate，你覆盖时得 inspect 实际渲染结构，不能只看模板源码
哪些地方必须加 translate="no"，哪些根本不用
不是所有英文都要锁死。真正需要加的，是那些语义固定、大小写/符号/顺序不可变的内容：
-
fetch()、useEffect、npm install -D vite—— 函数名、命令、空格和连字符都影响可读性 -
v5.2.0、React 18.3—— 数字和点一旦被译成“五点二零”就失效 -
/api/v1/users/:id、user_abc123、XZ-3000—— 路径、ID、编号含结构语义 -
<time datetime="2024-06-15"></time>外层建议套translate="no"，避免日期数字被转成本地格式 - 但
<button>Submit</button>这类 UI 文案不该加——它本就该随用户语言切换
为什么不能全局加 translate="no" 到 <html>
看似省事，实则破坏多语言体验：
立即学习“前端免费学习笔记（深入）”；
- 按钮文字、表单提示（如
Invalid email）、模态框标题等本该本地化的部分全被跳过 - 某些旧版 Edge 或翻译插件对全局
translate="no"支持不稳，局部控制更可靠 - 若页面本身是纯英文技术文档，应优先考虑不提供翻译入口，而不是靠属性兜底
-
<textarea>和<input>的value值不受父级继承影响，必须单独加translate="no"
最容易被忽略的是：v-html 渲染的富文本里，translate 属性依然生效，但前提是原始 HTML 字符串中已写好——服务端或 CMS 输出时就得带上，前端 runtime 补不了。
