MIME类型：使用txt扩展名链接CSS

Question

<link type="text/css" media="all" rel="stylesheet" href="./foo.css.txt" />

Firbug错误

---

样式表foo.css.txt未加载，因为它的MIME类型为"text/plain"，而不是"text/css"。

解释

---

浏览器将CSS解释为文本文档，而不是CSS，尽管尝试通过浏览器强制其MIME类型。当然，在生产中，我将使用foo.css（没有txt扩展名），但我认为这应该是可能的。对于JavaScript，它可以正常工作：

<script type="text/javascript" src="./index.js.txt"></script> 

其他想法

---

• 在Firebug中设置type="css"不会显示错误，页面也能通过验证，但CSS无法正确加载 - 我很确定这不是一个有效的MIME类型。我试图找到W3C的MIME类型列表，但像其他所有东西一样，很难找到/理解W3C。

• 这在其他不太流行的扩展中确实有效，例如dat：href="./foo.css.dat"

- vol7ron

Answer 1

当您在HTML中使用type属性时，您是在说“当您获取此资源时，期望获得此类型的数据。”这使得用户代理（如浏览器）可以避免请求它们知道无法处理的资源。对于CSS，您需要将其设置为text/css。

当服务器响应请求时，HTTP Content-Type标头表示“此内容属于此类型”。它是规范的，并且对于CSS数据也必须设置为text/css。

因为您使用了一个.txt文件，在默认配置下，服务器会说该文件包含的数据是text/plain，因此它会告诉浏览器。您无法从浏览器覆盖此设置。

JavaScript可以正常工作

出于各种原因，浏览器往往会忽略服务器指定的JavaScript的Content-Type。这可能被认为是这些浏览器中的错误。

在Firebug中设置type =“css”不会显示错误，并且页面经过验证，但是CSS加载不正确-我相当确定那不是有效的MIME类型

css不是注册的MIME类型，浏览器不认识它作为它可以理解的样式表语言，因此它甚至不尝试下载它。

我尝试找到W3C的MIME类型列表，但与所有其他内容一样，很难找到/理解W3C

W3C不负责MIME类型注册表，您可以在http://www.iana.org/assignments/media-types/找到它。

- Quentin

---

我认为真正的问题是：是否可能在HTML页面中使其工作，这一点我没有包括在内。我相当确定我以前曾经在Apache中修改过txt文件的内容类型，但我想看看是否有一种快速简便的方法来添加“链接”元素。-- 我也将测试使用JavaScript动态加载CSS文件时会发生什么。 - vol7ron

不，没有什么快速简单的方法可以添加到链接元素中，正如我所说：“您无法从浏览器覆盖此内容。” - Quentin

Answer 2

如果有人仍然想要这样做，可以使用JavaScript实现。以下是一个基于jQuery的简单解决方案：

var sheet = $('<style></style>')
$('head').append(sheet)
sheet.load("./foo.css.txt")

- Greg Ball

---

有趣的例子 - 将文件作为文本检索并在其周围构建STYLE元素。虽然已经过了一段时间，但我认为我这样做的原因是为了快速调试/浏览js/css文件，而不更改任何操作系统文件类型关联。这样，操作系统可能仍会执行js文件，但会在类似记事本的应用程序中打开js.txt。CSS可能是为了保持一致性。 - vol7ron

跟进：我几年前的评论并没有充分肯定这个答案，这个方法可以绕过问题。对于这种创造性的方法点赞。 - vol7ron

Answer 3

如果您使用 .php 而不是 .txt，您可以从文件本身设置类型。

- Damien

---

请查看我为RDL留下的评论。 - vol7ron

好的。我能想到的另外一种方法是通过Apache更改文件处理方式，但是你表示不想采用这种方法。 - Damien

是的，为了避免针对txt文件的特殊配置。这只是一个练习，不是生产案例。 - vol7ron

Answer 4

尝试使用像 .php 这样的服务器端扩展。

在这种情况下，您可以在文档本身中设置 MIME 类型。

- RDL

---

这不是为了让它工作而去获取某些东西，而是为了让它能够在不更改服务器配置的情况下与“.txt”一起工作。 - vol7ron