site.css的CSS样式未生效被用户代理样式覆盖的原因是什么？

你可以按以下顺序逐一排查问题：

• 路径不匹配：确认你的目录结构符合href="css/site.css"的相对路径规则：index.html文件需和css文件夹处于同一级目录，且css文件夹下存在命名完全一致的site.css文件。注意Linux等系统对文件名、文件夹名大小写敏感，若实际命名为Site.css或CSS文件夹都会导致资源加载失败。
• 缓存问题：浏览器会缓存静态资源，可通过强制刷新（Windows系统按Ctrl + F5，Mac系统按Cmd + Shift + R）拉取最新的css文件验证。
• 资源加载错误：按F12打开浏览器开发者工具，切换到「控制台」标签页，查看是否存在site.css文件404报错，若存在则说明路径配置错误。也可切换到「元素」标签页，选中#login-block元素，查看右侧样式面板是否加载到你编写的自定义规则，确认是否存在更高优先级的样式覆盖了自定义样式。
• CSS语法错误：检查site.css文件内是否存在未闭合的大括号、错误字符等语法问题，局部语法错误可能会导致后续所有样式规则失效。
• 样式预期偏差：你代码中为.popup-form设置了display: none规则，该元素默认会被隐藏，属于样式正常生效的表现，不属于失效问题。

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