在 Firefox 中 'View > Page Style' 下未显示替代样式表

Question

我有以下代码：

...
<head>
  <title>Alternative Style Sheet Example for MDC</title>
  <link href="./default.css" rel="stylesheet" type="text/css" title="Default Style">
  <link href="./simple.css" rel="alternate stylesheet" type="text/css" title="Simple">
  <link href="./insane.css" rel="alternate stylesheet" type="text/css" title="Insane">
</head>
...

（来自 https://developer.mozilla.org/samples/cssref/altstyles/index.html）。如果我在 Firefox 中打开 html 文件的本地副本，备用样式表不会在 Firefox 中显示在 'View > Page Style' 下，我只能看到 'No Style' 和 'Basic Page Style' 选项。但是，如果我打开上面的 link，所有样式表都会在选择中正确显示（'No Style'、'Default Style'、'Simple' 和 'Insane'）。还在 Chrome 中使用 Alt CSS 扩展进行了测试，同样的行为。

我怎样才能使本地副本的选项也可见？

Answer 1

似乎如果我只是在 Firefox 中打开本地 .html 文件，样式表切换不会按预期工作。但是，如果我运行一个网络服务器并通过本地主机打开同一个文件，样式表切换就会起作用。

在我的例子中，我运行在我的 .html 文件目录中执行以下命令（python 2.x）：

python -m SimpleHTTPServer 8000

然后在我在 Firefox 地址栏中输入 localhost:8000 后，样式表选项正确显示在 'View > Page Styles' 菜单下（与在地址栏中输入 file:///{path}/index.html 相对）。

该解决方案也适用于 Chrome 和 Alt CSS 扩展。

在 Firefox 中 'View > Page Style' 下未显示替代样式表

Alternate stylesheets not showing up under 'View > Page Style' in Firefox

html

css

firefox

stylesheet