CSS 在 Chrome 中不起作用答案

【问题标题】：CSS not working in ChromeCSS 在 Chrome 中不起作用
【发布时间】：2013-07-25 22:05:12
【问题描述】：

没有为我正在处理的网站的此页面加载 CSS：http://www.thesanfordcenter.net/sanford-center。它只发生在 Chrome 中，但不是缓存问题，因为在另一台计算机上的 Chrome 中发生了同样的问题，并且我已清除浏览器中的所有浏览和缓存历史记录。

它似乎在 FF 和 IE 中正常工作。该站点上使用不同模板的子页面似乎运行良好。

我不确定是什么原因造成的。任何帮助将不胜感激。

【问题讨论】：

【解决方案1】：

确保您的 CSS 和 HTM/HTML 文件使用相同的编码！

如果您的 HTM/HTML 文件被编码为 UNICODE，那么您的 stylesheet 也必须如此。

IE 和 Edge 并不繁琐：无论编码如何，都会呈现样式表。但是 Chrome 完全不能容忍不匹配的编码。

我尝试了所有可以在 Internet 上找到的解决方案/建议，然后才注意到，在我的文本编辑器中，我使用了不同的编码。一旦我使用与网页相同的编码保存样式表，问题就消失了。

【讨论】：

【解决方案2】：

在谷歌浏览器中

>> goto settings
>> search for cache
>> clear browsing data
>> check cached images and files (the past hour / day)
>> clear browsing data

然后转到您的网页并按“Ctrl + r”

希望这能解决您的问题干杯。

【讨论】：

【解决方案3】：

问题可能是因为浏览器无法加载文件：

【讨论】：

【解决方案4】：

检查您调用代码的来源。 “stylesheets”文件夹编码为“StyleSheets”。可能是区分大小写的把它搞砸了。

我在想可能是因为 expstickybar.css 文件正确呈现并且它引用了“样式表”文件夹

【讨论】：

【解决方案5】：

比较您引用的页面和子页面之间的 css 链接，您的链接中有一个“媒体”属性：

问题：

<link href="/stylesheets/css_Sanford.css" rel="stylesheet" type="text/css" media="only screen and (min-device-width: 481px" />

工作：

<link href="/stylesheets/css_Sanford.css" rel="stylesheet" type="text/css" />

尝试删除“媒体”属性，它应该可以正常工作。

更具体地说，“仅”似乎不是对媒体属性的有效操作。详情请见this W3Schools page。

【讨论】：

【解决方案6】：

你确定路径是正确的吗？ Chrome 中的开发者工具显示以下错误。

加载资源失败：服务器响应状态为 404（错误：找不到请求的文件。）http://www.thesanfordcenter.net/CircularContentCarousel/css/demo.css

【讨论】：

【解决方案7】：

它不存在：

这是一个 404 未找到：

【讨论】：