标签是一把双刃剑：必须设为绝对url或根相对路径（以/开头且结尾带/），置于最前且唯一，仅影响html中纯相对路径的src/href/action等属性，对fetch、import等无效。
<base> 标签不是“设个路径就完事”的配置项，它是一把双刃剑：用对了能统一资源加载逻辑，用错了会静默失效、引发大面积 404，且毫无提示。
base href 值必须是绝对 URL 或根相对路径，否则被浏览器静默忽略
浏览器只接受以 https://、http://、// 或 / 开头的 href 值。其他写法一律被丢弃，不报错也不警告。
-
<base href="static/">→ 缺协议和域名，被忽略 -
<base href="../assets/">→ 含..，被忽略 -
<base href="https://example.com">→ 结尾没/，Firefox/Opera 会截断路径（css/app.css变成https://example.comcss/app.css） -
<base href="/subapp">→ 同样缺结尾/，风险同上；正确应为<base href="/subapp/">
生产环境推荐完整绝对 URL：<base href="https://cdn.example.com/v2.3/">；本地开发可用 <base href="http://localhost:3000/">，比 / 更安全，避免和后端路由冲突。
base 必须放在 最前面，且只能有一个
HTML 解析是自上而下进行的。<base> 的作用是为后续所有相对 URL 提供基准，所以它必须是 中第一个元数据类元素。
- 错误顺序：
<title>My Page</title> <link href="css/main.css"> <base href="https://cdn.example.com/">→main.css仍按当前页 URL 解析 - 正确顺序：
<base href="https://cdn.example.com/"> <title>My Page</title> <link href="css/main.css"> - 若文档中出现多个
<base>，只有第一个生效；写在中则完全被忽略
哪些属性真受影响，哪些完全不受控
<base> 只在 HTML 解析阶段起作用，改写的是 src、href、action 等属性中**纯相对路径**（即不以 /、: 或协议开头）的初始解析逻辑。
- ✅ 受影响：
<img src="logo.png">、<link href="style.css">、<script src="app.js"></script>、<form action="submit.php"></form>、CSS 中的background: url(avatar.jpg) - ❌ 完全不受：
fetch('./api/data.json')、import('./utils.js')、new Worker('./worker.js')、CSS@import "reset.css"、<iframe src="page.html"></iframe> - ⚠️ 半受影响：
document.baseURI返回<base href>的值，可用于构造 URL（如new URL('data.json', document.baseURI)），但window.location和document.URL完全不变
SPA 部署子路径时，
单页应用部署到非根路径（如 https://example.com/admin/）时，<base href="/admin/"> 是必要条件，但它只是起点——你还得确保：
- 构建工具（Vite/Webpack）的
base或publicPath配置与之匹配 - 前端路由库（Vue Router v4+、React Router v6+）显式传入
base参数，它们不读document.baseURI - 服务端配置将所有子路径请求 fallback 到
index.html，否则刷新页面直接 404
最容易被忽略的是：CSS 文件内的 url() 和 JS 中的 import() 不受 <base> 控制，它们始终以各自文件所在位置为基准——这导致你改了 <base> 却发现图片还是 404，问题根本不在那儿。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
