将index.html重命名为index.php后CSS样式失效如何解决

• 优先排查访问方式是否正确
  PHP文件不能直接双击本地文件打开（此时浏览器地址为file://开头），必须通过本地Web服务（如XAMPP、WAMP、Laragon等）访问，地址格式为http://localhost/你的项目目录名/index.php，直接本地打开会导致相对路径引用的CSS、JS等资源全部加载失败，这是这类问题最常见的诱因。
• 检查资源路径是否匹配
  打开浏览器F12开发者工具，切换到网络面板，刷新页面后查看CSS文件的请求状态，如果是404报错，对比请求的CSS路径和实际文件存放路径是否一致：
  1. 确认重命名index.php后，文件所在目录没有变动，和原index.html位置完全相同，同级的css、js等资源文件夹也没有移动或改名
  2. 检查HTML头部的<link>样式引用标签是否完整，没有被误改，相对路径层级和实际结构匹配，如果需要可以改成根路径引用（例如站点根目录就是项目目录时，写为<link rel="stylesheet" href="/css/对应样式文件名.css">）
• 检查PHP代码是否有异常输出
  确认你添加的<?php ?>标签没有放在文档声明<!DOCTYPE html>之前输出多余内容：
  1. 检查PHP标签前有没有多余的空格、换行，或者文件是否带UTF-8 BOM头，这些内容输出到HTML前会导致浏览器解析文档结构异常
  2. 右键查看浏览器页面源代码，确认输出的HTML内容和原index.html内容（除你添加的PHP逻辑外）完全一致，没有多余字符
• 排查 mime 类型配置
  如果上述步骤都没问题，检查你的Web服务配置，确认.css后缀文件的mime类型输出正确，没有被错误配置为其他类型导致浏览器不识别为样式文件。

内容的提问来源于stack exchange，提问作者Alexandre