为什么引入同目录下CSS文件时会收到404 NOT FOUND错误？

你当前使用的<link rel="stylesheet" href="./styles.css">语法本身没有错误，404报错可按照以下步骤逐一排查：

• 校验文件实际存放位置
  确认styles.css文件确实和当前HTML文件存放在同一级目录，没有被误放在子文件夹（如css文件夹）或者上一级目录中。
• 检查文件名大小写匹配
  如果你使用的是Linux服务器、MacOS或者WSL环境运行服务，文件路径大小写严格敏感。请确认文件名完全匹配styles.css，而非Styles.css、style.css、styles.CSS这类大小写不一致的名称。
• 核对开发服务的根目录配置
  如果你使用Live Server、vite、webpack等工具启动本地服务，需要确认服务的根目录是否指向HTML文件所在的文件夹。比如你用VS Code的Live Server打开的是整个项目文件夹，而HTML文件存放在项目的子文件夹内，./相对路径会被解析为项目根目录而非HTML所在的子目录，此时你需要调整href为对应子目录路径，或者直接将HTML文件放在服务根目录下。
• 确认文件后缀没有被系统隐藏
  Windows系统默认隐藏已知文件后缀，有可能你实际创建的文件是styles.css.txt，只是系统隐藏了.txt后缀导致你误认为是css文件。可以在文件管理器的查看选项中开启「文件扩展名」显示，确认文件后缀正确。
• 强制刷新清除缓存重试
  按下Ctrl+Shift+R（Mac系统为Cmd+Shift+R）强制刷新页面，避免浏览器加载旧的缓存资源导致报错。

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