base href仅作用于纯相对路径（如logo.png），对绝对路径（http://、https://、//）和根相对路径（/开头）完全无效；合法值仅限绝对url（结尾需斜杠）、根相对路径（首尾均需斜杠）或协议相对路径（//开头）。
base href 对绝对路径和根相对路径完全无效
浏览器明确跳过所有以 http://、https://、// 或 / 开头的 URL，<base href="https://cdn.com/"> 不会改变 <img src="https://cdn.com/logo.png?x-oss-process=image/resize,p_40"> 或 <link href="/css/main.css"> 的解析结果。这类路径直接按原始语义拼接，<base> 根本不介入。
常见误判是以为设了 <base href="https://cdn.example.com/v3/"> 后，<img src="/images/icon.svg"> 也会被重写到 CDN——实际不会，因为 /images/icon.svg 是根相对路径，浏览器直接拼到当前 origin，和 base 无关。
base href 只接管纯相对路径（如 logo.png）
<base> 的作用发生在 HTML 解析阶段，仅改写那些既不带协议、也不以 / 开头的路径。它不是“加前缀”，而是重置整个解析起点——写错一个字符，<script src="app.js"></script> 就 404，且控制台通常不报错。
-
<img src="logo.png">→ 拼成https://cdn.example.com/v3/logo.png -
<form action="submit.php"></form>→ 拼成https://cdn.example.com/v3/submit.php -
<link href="theme.css">→ 拼成https://cdn.example.com/v3/theme.css - CSS 文件内
background: url(avatar.jpg)→ 也受控（注意：这是 HTML 解析时计算的，不是 CSS 引擎自己 resolve）
href 值写错就等于没写，且静默失效
浏览器对 href 值校验极严：<base href="assets/">、<base href="../static/">、<base href="%PUBLIC_URL%/"> 全部被静默忽略——不警告、不报错，后续所有相对路径仍按当前页面 URL 解析，上线后批量 404。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
合法值只有两种：
-
https://cdn.example.com/v3/✅（绝对 URL，结尾斜杠不能少） -
/myapp/✅（根相对路径，开头和结尾都必须是/） -
//cdn.example.com/v3/✅（协议相对，自动继承当前页 http/https）
写成 /myapp（缺末尾 /）在 Firefox/Opera 中会把 css/app.css 错拼成 /myappcss/app.css。
容易被当成“受控”但其实完全不受影响的场景
很多路径看着像相对路径，实则运行时由 JS 或 CSS 引擎独立解析，<base> 对它们毫无作用：
-
fetch('./api/data.json')—— JS 运行时行为，走当前window.location起点 -
import('./utils.js')—— 模块加载器决定路径，与base无关 - CSS 中的
@import "reset.css"—— CSS 引擎解析，不经过 HTML 解析器 -
<img srcset="logo-2x.png 2x">——srcset不走base规则 -
<iframe src="/admin/frame.html"></iframe>—— 根相对路径，直接拼域名
真正难排查的是：你改了 <base href="/subapp/">，但 fetch() 请求还是发到根路径——这不是 bug，是设计如此。别指望它统一管理所有路径，它只管 HTML 属性里那几类硬编码的纯相对路径。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
