<base>标签必须是<head>中第一个元数据类元素，用于在HTML解析阶段重置后续所有相对URL的基准；href须为绝对URL或根相对路径（如/abc/），且仅影响<img src>、<script src>等HTML属性中的纯相对路径，不影响JS/CSS运行时路径。
base标签必须是中第一个元数据类元素
HTML 解析器按顺序处理
内容，<base> 的作用是重置“后续所有相对 URL”的解析基准。它不是声明式配置，而是解析时的实时干预——如果 <link href="style.css"> 出现在 <base> 前面，那这个 CSS 就已经按原始页面 URL 解析完了，<base> 对它完全无效。
正确顺序只有一种：<base> 必须紧贴 <head> 开始，早于 <title>、<meta>、<link>、<script> 等任何其他标签：
<head> <base href="https://cdn.example.com/v3/"> <title>My App</title> <link rel="stylesheet" href="main.css"> <script src="app.js"></script> </head>
-
href值必须是绝对 URL（含协议）或根相对路径（以/开头），例如https://cdn.example.com/v3/、//cdn.example.com/v3/、/myapp/ - 禁止使用普通相对路径如
../static/或assets/，浏览器会静默忽略整个<base>标签 - 多个
<base>标签只取第一个，其余被丢弃；Chrome 控制台会提示Multiple base elements detected. Only the first one is used.
放在里或动态插入都无效
把 <base href="/static/"> 塞进 <body>，浏览器直接忽略——不报错、不警告、也不生效。这不是兼容性问题，而是规范强制要求：HTML5 明确规定 <base> 必须位于 <head> 内部。
用 JS 动态插入同样没用：
立即学习“前端免费学习笔记（深入）”；
const base = document.createElement('base');
base.href = '/myapp/';
document.head.appendChild(base);
已解析的 <img src="logo.png"> 不会重新计算路径，只有之后新创建的元素（比如用 document.createElement 创建的 <a>）才受新 <base> 影响。
- SSR 模板拼接时容易翻车：header 模板和 page 模板各自 render 一个
<base>→ 只有 header 里的那个生效 - 构建工具（如 Vite、Webpack）注入资源时若未对齐
<base>位置，CSS/JS 路径可能 404
href 和 target 的实际影响范围
<base> 的 href 属性会影响所有相对 URL 的解析，包括：<a href="page.html">、<img src="icon.png">、<script src="bundle.js">、<link href="theme.css">、<form action="submit.php">。
target 属性则统一控制 <a> 和 <form> 的跳转行为，但不会覆盖已有 target 属性（即显式写了 target="_blank" 的链接仍按显式值执行）。
- SPA 场景下，
<base href="/app/">会让<a href="user">解析为/app/user，这与前端路由的 base 配置必须一致，否则导航失败 - CDN 加速时常用协议相对写法：
<base href="//cdn.example.com/v3/">，自动继承当前页协议（HTTP/HTTPS） -
href结尾建议带/，否则<img src="logo.png">会被解析成https://example.com/v3logo.png（拼接无分隔符）
容易被忽略的细节：空 href、重复 base、构建时路径错位
最隐蔽的问题不是语法错误，而是构建流程与运行时环境脱节。比如开发时用 <base href="/>，上线后部署到子路径 /admin/，却忘了改 <base href="/admin/">，结果所有相对资源全部 404。
-
href为空字符串（<base href="">）在部分浏览器中等价于当前页面 URL，但行为不稳定，应避免 - 服务端模板（如 EJS、Thymeleaf）中条件渲染
<base>时，要确保最终 HTML 中只有一个且位置正确 - Vite 的
base配置（vite.config.js中的base: "/myapp/"）会自动注入<base>，此时手写<base>可能冲突
