标签用于统一设置页面内所有相对URL的解析基准，必须置于中且仅能出现一次；其href值须为绝对URL或根相对路径，动态修改无效。

<base> 标签的作用是设置页面内所有相对 URL 的解析基准

它不改变已有绝对 URL，只影响 <a></a>、<img alt="HTML5base标签作用是什么_基准URL设置指南【方法】" >、<script></script>、<link>、<iframe></iframe> 等标签中出现的相对路径。浏览器在解析这些相对地址时，会以 <base> 指定的 href 值为起点，而非当前页面 URL。

必须放在 中，且只能出现一次

HTML5 明确规定：<base> 只能作为 的子元素，且整个文档中最多允许一个。如果写了多个，只有第一个生效；如果写在 里，多数浏览器会忽略或触发解析警告。

• 错误位置示例：

  <body>
    <base href="https://cdn.example.com/">
  </body>

• 正确写法：

  <head>
    <base href="https://cdn.example.com/">
  </head>

• 若同时设 href 和 target，两者都生效，例如：

  <base href="/static/" target="_blank">

  ——所有相对链接默认用 /static/ 解析，且点击后在新窗口打开

href 值必须是绝对 URL 或根相对路径（/ 开头）

不能是普通相对路径（如 ./assets/ 或 images/），否则浏览器会静默忽略该 <base> 标签，不报错但也不生效。

DeepBI DHTML 页面生成器

生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur

下载

• ✅ 合法：href="https://example.com/assets/"、href="/assets/"
• ❌ 无效：href="assets/"、href="../static/"、href="data:,"
• 注意：即使页面本身是 file:// 协议，<base href="http://..."> 仍可生效，但部分本地开发场景下（如直接双击打开 HTML 文件）可能受限于跨源策略，导致资源加载失败

动态修改 <base> 不会重新解析已存在的相对 URL

DOM 中插入或修改 <base> 元素，只会影响后续解析的相对 URL（比如新插入的 <img alt="HTML5base标签作用是什么_基准URL设置指南【方法】" >），不会重写已渲染的链接或已发起的资源请求。这点常被误认为“刷新 base 就能修复路径”，实际无效。

立即学习“前端免费学习笔记（深入）”；

• JavaScript 修改无效示例：

  document.querySelector('base').href = 'https://new-cdn.com/';

  ——已有 <img src="logo.png" alt="HTML5base标签作用是什么_基准URL设置指南【方法】" > 仍按旧 base 加载
• 真正需要切换基准路径时，应提前确定并静态写入 <base>，或改用 JavaScript 手动拼接 URL（如 new URL('logo.png', document.baseURI)）
• 服务端渲染（SSR）或构建工具（如 Webpack/Vite）中，更推荐通过配置统一处理资源路径，而非依赖 <base>，避免运行时歧义

多数现代前端项目其实不需要 <base> —— 它容易引发隐式行为，尤其在路由（如 SPA 的 /user/123 页面）和资源路径混用时，href="/api" 和 href="api" 会因 base 设置产生完全不同的请求目标。真要用，务必全链路验证所有相对引用是否如预期解析。