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

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

它不改变已有绝对 URL，只影响 、、、、 等标签中出现的相对路径。浏览器在解析这些相对地址时，会以 指定的 href 值为起点，而非当前页面 URL。

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

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

• 错误位置示例：

• 正确写法：

• 若同时设 href 和 target，两者都生效，例如：
  ——所有相对链接默认用 /static/ 解析，且点击后在新窗口打开

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

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

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

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

DOM 中插入或修改 元素，只会影响后续解析的相对 URL（比如新插入的 ），不会重写已渲染的链接或已发起的资源请求。这点常被误认为“刷新 base 就能修复路径”，实际无效。

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

• JavaScript 修改无效示例：

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

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

# javascript  # java  # html  # 前端  # go  # html5  # vite  # 浏览器  # 工具  # 路由  # cdn 

相关栏目： 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571 】

相关推荐： 简单实现Android文件上传  北京网站制作费用多少,建立一个公司网站的费用.有哪些部分,分别要多少钱？  如何在阿里云ECS服务器部署织梦CMS网站？  如何快速搭建高效WAP手机网站？  Laravel如何实现模型的全局作用域？（Global Scope示例）  深圳网站制作平台,深圳市做网站好的公司有哪些？  Python图片处理进阶教程_Pillow滤镜与图像增强  Laravel如何正确地在控制器和模型之间分配逻辑_Laravel代码职责分离与架构建议  详解Android——蓝牙技术 带你实现终端间数据传输  HTML 中动态设置元素 name 属性的正确语法详解  Laravel如何使用Blade模板引擎？（完整语法和示例）  javascript中数组（Array)对象和字符串（String)对象的常用方法总结  网站制作公司哪里好做,成都网站制作公司哪家做得比较好，更正规？  如何在万网ECS上快速搭建专属网站？  Laravel队列由Redis驱动怎么配置_Laravel Redis队列使用教程  轻松掌握MySQL函数中的last_insert_id()  Laravel如何实现API速率限制？（Rate Limiting教程）  Laravel如何实现密码重置功能_Laravel密码找回与重置流程  香港代理服务器配置指南：高匿IP选择、跨境加速与SEO优化技巧  制作旅游网站html,怎样注册旅游网站？  Laravel如何使用API Resources格式化JSON响应_Laravel数据资源封装与格式化输出  Laravel如何使用Contracts（契约）进行编程_Laravel契约接口与依赖反转  东莞市网站制作公司有哪些,东莞找工作用什么网站好？  大连网站制作公司哪家好一点,大连买房网站哪个好？  Laravel怎么自定义错误页面_Laravel修改404和500页面模板  高防服务器租用如何选择配置与防御等级？  在线教育网站制作平台,山西立德教育官网？  齐河建站公司：营销型网站建设与SEO优化双核驱动策略  LinuxCD持续部署教程_自动发布与回滚机制  微信小程序 require机制详解及实例代码  Laravel怎么创建控制器Controller_Laravel路由绑定与控制器逻辑编写【指南】  laravel怎么使用数据库工厂（Factory）生成带有关联模型的数据_laravel Factory生成关联数据方法  Windows10如何删除恢复分区_Win10 Diskpart命令强制删除分区  如何用景安虚拟主机手机版绑定域名建站？  Laravel怎么配置S3云存储驱动_Laravel集成阿里云OSS或AWS S3存储桶【教程】  PHP正则匹配日期和时间(时间戳转换)的实例代码  公司网站制作价格怎么算,公司办个官网需要多少钱？  JavaScript中如何操作剪贴板_ClipboardAPI怎么用  ,网页ppt怎么弄成自己的ppt？  详解阿里云nginx服务器多站点的配置  百度输入法ai组件怎么删除 百度输入法ai组件移除工具  Laravel如何集成微信支付SDK_Laravel使用yansongda-pay实现扫码支付【实战】  Python文件流缓冲机制_IO性能解析【教程】  🚀拖拽式CMS建站能否实现高效与个性化并存？  ,南京靠谱的征婚网站？  韩国代理服务器如何选？解析IP设置技巧与跨境访问优化指南  网站制作大概要多少钱一个,做一个平台网站大概多少钱？  Laravel怎么使用Intervention Image库处理图片上传和缩放  Laravel如何优雅地处理服务层_在Laravel中使用Service层和Repository层  Laravel如何生成和使用数据填充？（Seeder和Factory示例）