最推荐用 <link> 标签在 <head> 中引入外部 CSS，需确保 href 路径相对于 HTML 文件、rel="stylesheet" 不可省略；<script> 推荐放 </body> 前或加 defer，路径规则相同，避免缓存和 DOM 时机问题。
直接用 <link> 和 <script> 引入外部文件是最稳妥、最可维护的方式，内联或内部写法只适合极小规模调试或临时验证。
怎么用 <link> 正确引入 CSS 文件
CSS 必须放在 <head> 里，且路径必须相对于 HTML 文件位置。浏览器按顺序加载，错位或路径错误会导致样式完全不生效。
-
href值是相对路径，比如css/style.css表示 HTML 同级目录下有个css文件夹，里面是style.css - 不要写成绝对路径如
C:/project/style.css或带协议的http://...，除非你真在部署到远程服务器且有意为之 - 如果 CSS 没生效，右键页面 →「检查」→ 切到「Network」标签，筛选
css，看对应文件状态码是不是404 - 多个 CSS 文件按依赖顺序引入，比如重置样式（reset）在前，业务样式在后
怎么用 <script> 引入 JS 文件才不会报错
JS 默认阻塞 HTML 解析，所以推荐放在 </body> 前；若必须放 <head>，加 defer 属性——否则可能因 DOM 还没加载完就执行脚本而报 Cannot read property 'xxx' of null。
- 路径规则和 CSS 一样：相对 HTML 文件位置，比如
js/main.js表示同级js目录下的文件 - 不加
defer或async的<script src="...">放在<head>里，大概率触发document.getElementById(...)返回null - 开发时别依赖双击打开 HTML：
fetch、XMLHttpRequest、本地file://协议下会被浏览器直接拦截，必须起本地服务 - 想确认 JS 是否加载成功？控制台输入
typeof myFunctionName（把myFunctionName换成你定义的函数名），返回"function"才算对
为什么有时改了 CSS/JS 文件，刷新页面却没变化
不是代码写错了，而是浏览器缓存了旧版本。尤其用 VS Code + Live Server 时，它默认启用缓存策略，但 Ctrl+F5 强刷未必生效。
立即学习“Java免费学习笔记（深入）”；
- Chrome 开发者工具 → 「Network」→ 勾选「Disable cache」（仅在 DevTools 打开时有效）
- 给
<link>或<script>的href/src加时间戳参数，比如style.css?v=1.0.1，每次改完手动加个数字 - Live Server 插件右键菜单里有「Reopen with Live Server」，比单纯刷新更可靠
- 注意：CSS 中的字体、图片等资源也受缓存影响，改了
@font-face或background-image路径后同样要清缓存
路径写错、缓存没清、DOM 加载时机误判——这三个点占了 90% 以上的“引入失败”问题。其他花哨配置都是建立在这三者正确的基础上才值得考虑。
