css 文件 404 错误通常源于路径理解偏差：浏览器加载的是最终渲染的 html 页面（如 index.php），而非被包含的 header.php；因此 css 路径必须相对于该主页面所在位置，而非 php 模板文件。
在 Web 开发中，<link rel="stylesheet"> 的 href 属性指定的是浏览器发起 HTTP 请求时所依据的 URL 路径，而非服务器端文件包含关系（如 include 'header.php'）。这意味着：
- 即使 style.css 与 header.php 在同一目录下，只要 header.php 是通过 require 或 include 被其他页面（如 index.php）引入的，那么 CSS 路径就必须以 index.php 所在位置为基准来计算；
- 浏览器永远“看不到” header.php —— 它只向服务器请求 index.php（或 /、/about 等实际 URL），服务器执行后返回完整 HTML，其中 <link> 标签的 href 值会被浏览器独立解析并发起新请求。
✅ 正确做法：使用绝对路径（从 Web 根目录起始）
推荐写法（假设 CSS 存放在网站根目录下的 css/style.css）：
<link rel="stylesheet" href="/css/style.css">
⚠️ 注意：开头的 / 表示“Web root”，即域名后的第一级路径（例如 https://example.com/css/style.css）。该路径与当前 PHP 文件物理位置无关，稳定可靠。
❌ 常见误区与解释：
- href="style.css" → 相对于当前 URL 路径（如访问 /blog/post1，则请求 /blog/style.css）
- href="./style.css" → 同上，等价于无前缀形式
- href="../style.css" → 尝试向上跳一级目录，但若当前 URL 是根路径 /，则 ../ 无效（Web 服务器禁止越权访问根外路径）
- href=".../style.css" → 语法错误，... 不是合法路径标识符
? 验证技巧：
- 在浏览器开发者工具（F12）→ Network → 刷新页面，筛选 CSS 类型，查看 style.css 请求的 Initiator（触发源）和 Request URL；
- 点击该请求，确认 Status 是否为 404，并比对显示的完整 URL 与你预期的文件真实位置是否一致；
- 直接在地址栏输入该完整 URL（如 https://yoursite.com/css/style.css），看能否正常下载 CSS 内容。
? 最佳实践建议：
立即学习“前端免费学习笔记（深入）”；
- 统一将静态资源（CSS/JS/images）置于 ./css/、./js/、./assets/ 等标准子目录；
- 在所有模板中均使用 /css/style.css 这类根相对路径；
- 若项目部署在子目录（如 https://example.com/myapp/），可借助 PHP 动态生成基础路径：
<link rel="stylesheet" href="<?php echo dirname($_SERVER['SCRIPT_NAME']) === '/' ? '/css/style.css' : rtrim(dirname($_SERVER['SCRIPT_NAME']), '/') . '/css/style.css'; ?>">
或更简洁地，在入口文件定义常量（如 define('ASSET_BASE', '/myapp');），再写 href="<?= ASSET_BASE ?>/css/style.css"。
掌握这一核心原则——“路径由浏览器解析，而非 PHP 解析”——即可彻底规避 90% 的样式表 404 问题。
