GitHub Pages部署后CSS样式不显示，本地Live Server正常求助

以下是针对该问题的常见排查和解决方法：

• 修正CSS引用路径
  本地Live Server的根路径是项目目录，但GitHub Pages部署后，站点的根路径会带上仓库名称（比如你的站点根路径是/my-restaurant/）。如果HTML中使用了绝对路径引用CSS（例如<link href="/css/style.css" rel="stylesheet">），会导致资源找不到。建议改为相对路径：

  • 若HTML文件在项目根目录，直接使用<link href="css/style.css" rel="stylesheet">
  • 或者使用基于当前文件的相对路径：<link href="./css/style.css" rel="stylesheet">

• 核对文件名大小写
  GitHub文件系统区分大小写，而本地Windows/macOS默认不区分。如果本地CSS文件名是Style.css，但HTML中写的是style.css，本地能正常加载，但GitHub Pages会返回404。确保文件名和引用的大小写完全一致。

• 确认GitHub Pages部署配置
  进入仓库的Settings -> Pages页面，检查部署分支（比如main分支）和部署目录（比如根目录/）是否设置正确，避免因分支或目录选错导致资源未被部署。

• 强制刷新浏览器缓存
  浏览器可能缓存了旧的页面资源，导致新部署的CSS未加载。可以使用Ctrl+Shift+R（Windows/Linux）或Cmd+Shift+R（Mac）强制刷新页面，或者用隐私模式访问站点测试。

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