如何在Firefox中调查“无法加载样式表”消息?

时间:2016-05-02 18:32:29

标签: css firefox

如何在Firefox中调查“无法加载样式表”消息?此消息在页面内容下方和开发人员工具上方显示为红色条。如何找出浏览器所指的文件?我正在Linux Mint 17.3上运行46.0版。

更新

如果我查看Firefox中开发人员工具的控制台,它会显示所有css文件,并对每个文件说“HTTP / 1.1 200 OK”。

另一次更新

此错误栏来来去去,特定页面不一致。

5 个答案:

答案 0 :(得分:5)

这几乎总是在CSS被gziped时发生,但是服务器返回不是压缩资源的Content-Length。当mod_deflate与mod_fastcgi一起使用时,会发生这种情况。这是服务器端的bug,而不是firefox。

答案 1 :(得分:5)

这可能是一个非常具体的边缘情况,但我有这个完全相同的错误,没有迹象表明Firefox正在抱怨哪个样式表。事实证明,这是我正在使用的广告拦截器。当我停用广告拦截器并重新加载我的页面时,错误就消失了。

答案 2 :(得分:2)

  

更新通知:

     

Firebug已过时,而不是您想要使用Firefox Developer Edition的firebug,它内置了Firebug类型的诊断和工具。

Get Firebug,或以其他方式查看页面源代码(在Firefox上右键单击并选择“查看源代码”),然后单击HTML页面的<head>部分中引用的每个.css样式表。其中一个或多个将返回错误404或其他一些错误。

每个CSS工作表都位于HTML头部的<link>元素中。

示例:

查看此页面的源代码会给出一堆代码,在<head>部分中是<link>

<!DOCTYPE html> 
<html itemscope itemtype="http://schema.org/QAPage"> 
<head> 
 ...
 <link rel="stylesheet" type="text/css" href="//cdn.sstatic.net/Sites/stackoverflow/all.css?v=8c7d44a438e6"> 
...
 </head>

这表明链接元素中有一个样式表,如果您点击所有这些(可能有多个)并找到可以提供特定错误的那个页面/网站,则会显示该页面/网站。

<强>更新

  

(更新)如果我查看Firefox中开发人员工具的控制台,它会显示所有的css文件,并说“&#34; HTTP / 1.1 200 OK&#34;针对每个文件。

因此,您应该在每个CSS和相关文档中查找 ,以查看哪个文档链接到无法访问的资源。

答案 3 :(得分:1)

style sheet could not be loaded的另一个原因是“活动混合内容”与HTTPS结合使用。即如果您的HTML代码是通过HTTPS加载的,但引用了通过HTTP传递的CSS,Firefox将阻止CSS文件。阻止将在Web控制台中生成解释性条目。有关详细信息,请参阅https://developer.mozilla.org/en-US/docs/Web/Security/Mixed_content/How_to_fix_website_with_mixed_content

如果通过带有重定向的HTTPS回答CSS文件的请求并且重定向URL使用HTTP,则也会发生阻塞。 Google Chromium还会通过HTTP阻止活动的混合内容,并在其Javascript控制台中创建一个条目。

答案 4 :(得分:0)

我从这个stackexchange页面得到了这个错误,在firebug控制台中得到了红线。它指向链接https://cdn.sstatic.net/Sites/stackoverflow/all.css?v=743e70f26396所以我检查了页面源复制/粘贴链接到新选项卡并按Enter键。 Firefox尖叫安全问题证书错误,所以我只是添加了一个异常并加载了CSS。 Chrome或IE中未显示此错误。

轻松修复。