外部css文件加载，但未应用 [英] external css file loading but not being applied

问题描述

Wetware错误

Wetware Error

这是一个拼写错误 - 有2个不同的css文件，

It was a typo - there were 2 different css files with similar names and I was linking to one on one site and another on the other

来自muppet的歉意：

Apologies from a muppet :(

已关闭

Closed

我在html头部分有以下行：

I have the following line in an html head section:

<link rel="stylesheet" href="http://files.hypernumbers.com/redesign/frontpage.css">

当我从域 hypernumbers.com 查看此页面时，

When I view this page from the domain hypernumbers.com it loads fine and then is applied.

但是当我从域 hypernumbers.dev 查看同一页面时，它会加载（Firebug和Chrome工具显示我的CSS文件是），但它不适用于页面

But when I view the same page from the domain hypernumbers.dev it loads (Firebug and Chrome tools show me that the CSS file is there) but it isn't applied to the page

有一些种类的域优先/子域的事情没有我不知道？

Is there some sort of domain precedence/sub-domain thing going no that I don't know about?

更新

不会在 hypernumbers.com 或 hypernumbers.dev ...中加载

Tried it in Opera where it doesn't load in either hypernumbers.com or hypernumbers.dev...

这是一个很古老的问题，但由于它是谷歌的最佳结果，我会把我的解决方案在这里。

This is a pretty old question, but since it's the top result in Google I'll put my solution here.

我有同样的问题，我的CSS文件是可访问的，正在由浏览器下载，但他们实际上并没有应用。我可以浏览到CSS手动只是罚款，但Firefox和Chrome都没有应用它们。

I was having the same issue, my CSS files were accessible and were being downloaded by the browser, but they weren't actually being applied. I could browse to the CSS manually just fine, but both Firefox and Chrome weren't applying them.

这是我的链接标签：

<link href="/static/css/bootstrap.css" rel="stylesheet" type="text/css">

看起来不错，这是正确的路径...我甚至记得设置类型， 。

Looks fine, that's the correct path... I even remembered to set the type, but no dice.

结果是，我的web服务器强制CSS文件的内容类型为 application / octet-stream 。因此，即使我在链接标记中指定类型，Firefox和Chrome都会看到服务器发出错误的内容类型，并拒绝应用样式表。

As is turns out, my web server was forcing the content-type on CSS files to application/octet-stream. So even though I specified type in the link tag, both Firefox and Chrome were seeing the wrong content-type from the server and refusing to apply the stylesheets.

如果您使用Firefox安装了 Firebug ，您可以看到您的服务器正在发送的内容类型Net选项卡。

If you're using Firefox with Firebug installed you can see the content-type your server is sending on the "Net" tab.

在我的例子中，使用Lighttpd，修复是添加css=> text / css到 mimetypes.assign 如此：

In my case, using Lighttpd, the fix was to add ".css" => "text/css" to mimetypes.assign like so:

mimetype.assign     = ( ".html" => "text/html",
                        ".txt" => "text/plain",
                        ".jpg" => "image/jpeg",
                        ".png" => "image/png",
                        ".css" => "text/css",
                        "" => "application/octet-stream" )

希望这可以节省几个小时的Google抓挠。

Hope this saves someone from a couple hours of Googling and head scratching.

这篇关于外部css文件加载，但未应用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！