404页面必须由服务器返回HTTP 404状态码才生效，本地双击打开或前端路由跳转均无效；需按GitHub Pages、Netlify、Vercel等平台规范配置，并确保HTML内联样式、禁用外链资源及JS依赖。
HTML文件本身不能“设置”404错误提示信息——404 是 HTTP 状态码，由服务器决定并返回，不是靠 HTML 标签或 JS 脚本生成的。你写的 404.html 只是服务器在返回 404 Not Found 状态时，把它的内容当响应体发出去。关键在于：页面存在 ≠ 真正生效。
为什么本地双击打开 404.html 总是显示 200？
浏览器用 file:// 协议打开 HTML 文件时，压根没有 HTTP 交互，更不会有状态码。所谓“404 页面”，必须经由 HTTP 服务响应才能成立。
- 验证方式只能是：
curl -I http://localhost:8000/nonexistent，看第一行是否为HTTP/1.1 404 Not Found - 或起一个最小服务：
npx serve -s .（注意：-s 会 fallback 到 index.html，要测真实 404 得去掉 -s，并确保目录下有404.html） - 浏览器开发者工具 → Network → 找请求 → 看 Response Headers 里的
Status字段
GitHub Pages / Netlify / Vercel 上 404.html 不生效的常见原因
平台不自动识别任意名字的错误页，也不保证返回真实 404 状态；必须严格按平台约定走。
- GitHub Pages：文件名必须是
404.html，且放在仓库根目录（和index.html同级），大小写敏感；它不会执行 JS，也不会处理前端路由 - Netlify：推荐用
_redirects文件写/* /404.html 404，比单纯放404.html更可靠，能强制返回状态码 - Vercel：默认不认
404.html；需在vercel.json中配置rewrites并显式设"status": 404，否则仍是 200 - 所有平台都禁止在
404.html里用<meta http-equiv="refresh">或setTimeout(() => location.href = '/')—— 这会让状态码变成 200
404.html 文件内部必须遵守的硬约束
它不是普通网页，而是在资源缺失场景下被注入响应体的内容，容错率极低。
立即学习“前端免费学习笔记（深入）”；
-
<title></title>必须含 “404”，比如<title>404 - 页面未找到</title>，否则搜索引擎和用户都会误判 - 主内容必须包裹在
<main></main>或带role="main"的容器里，屏幕阅读器靠这个跳过导航直接读错误 - CSS 必须内联进
<style></style>，禁用<link rel="stylesheet">—— 因为/css/style.css本身可能就 404，再触发一次失败请求 - 图片用 SVG 内联或 data URL，避免
<img src="/img/404.svg" alt="如何在HTML中设置404错误提示信息" >；路径一律用绝对根路径（/img/xxx），不用相对路径（./img/xxx） - 禁用依赖 JS 的核心功能：比如用
fetch()加载推荐文章、用history.back()做返回按钮（应改用<a href="javascript:history.back()"></a>作降级）
最常被忽略的一点：即使你写了完美的 404.html，只要服务器没把它和 404 Not Found 状态绑定，它就只是个普通 HTML 文件——对爬虫无效，对用户无反馈，对 SEO 是负分。状态码不是装饰，是契约。
