最推荐方式是通过主题配置或注入点挂载自定义css：butterfly须用inject.head配完整link标签；next优先填custom.css路径；fluid支持custom_css数组。所有css必须置于source/目录下，路径以/开头，避免放themes中或写错相对路径。
直接把 link 标签硬塞进主题 layout 文件里，是最容易出问题的做法。真正稳定、可维护的方式，是走主题提供的注入点或配置项，让 Hexo 在构建时自动处理路径、缓存和加载顺序。
Butterfly 主题必须用 inject.head 插入完整 link 标签
Butterfly 不识别 custom_css 这类通用配置项，写进去也无效。你得在 _config.butterfly.yml 里明确配 inject.head：
inject:
head:
- <link rel="stylesheet" href="/css/custom.css">
注意三点：
-
href必须以/开头，表示从站点根目录解析，否则构建后路径可能错乱 -
custom.css要放在source/css/下，不能放 themes/ 目录里——Hexo 只处理source/下的静态资源 - 如果用了 CDN 或第三方 CSS（比如
https://cdn.jsdelivr.net/npm/@highlightjs/cdn-assets@11.9.0/styles/github-dark.min.css），直接写完整 URL 即可，不用加/
Next 主题优先填 custom.css 配置项
Next 支持简洁的路径配置，不需要手写 HTML 标签：
custom: css: /css/custom.css
这个配置会自动渲染成标准 link 标签，并插入到 末尾。但要注意：
- 路径必须是相对于站点根目录的，
/css/custom.css对应的是source/css/custom.css - 如果你同时启用了
post_asset_folder: true，且某篇文章的 asset 文件夹里也有同名 CSS，它不会覆盖全局配置——Next 只认custom.css这个配置项指定的文件 - 不支持数组形式填多个 CSS，想加第二个就得改用
inject.head
Fluid 主题用 custom_css 数组最省心
Fluid 提供了原生数组支持，能一次性引入多个样式表：
custom_css: - /css/custom.css - https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;700
这种写法的好处是：
- 路径自动解析，不用拼 HTML 标签
- 支持本地路径和远程 URL 混用
- 加载顺序按数组顺序，适合控制层叠优先级
- 如果某个 URL 返回 404，Fluid 不会中断构建，只是该样式不生效
所有主题都绕不开的路径陷阱
无论哪种方式，只要路径写错，hexo g 不报错，但浏览器控制台会显示 net::ERR_ABORTED 或 404。常见错误包括：
- 把
custom.css放在themes/xxx/source/css/下——Hexo 构建时根本不会复制这个文件到public/ - 配置里写成
css/custom.css（缺开头的/）——实际请求变成https://yoursite.com/current-page/css/custom.css - 用相对路径如
../css/custom.css——Hexo 的静态资源处理器不解析这类路径，最终生成的 HTML 里就是字面量 - 修改完配置忘记
hexo clean && hexo g——旧的public/缓存还在，新 CSS 看不到
最稳妥的验证方式：生成后打开 public/index.html，搜 custom.css，确认 link 标签的 href 值是否指向 /css/custom.css，再手动访问该 URL 看能否下载到文件。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
