替代样式表未显示在 Firefox 的“查看 > 页面样式”下答案

【问题标题】：Alternate stylesheets not showing up under 'View > Page Style' in Firefox替代样式表未显示在 Firefox 的“查看 > 页面样式”下
【发布时间】：2019-11-08 10:17:18
【问题描述】：

我有以下代码：

...
<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 中的“查看 > 页面样式”下，我只能看到“无样式”和“基本页面样式”选项。但是，如果我打开上面的链接，所有样式表都会正确显示在选择中（“无样式”、“默认样式”、“简单”和“疯狂”）。还在 Chrome 中使用 Alt CSS 扩展进行了测试，行为相同。

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

【问题讨论】：

标签： html css firefox stylesheet

【解决方案1】：

如果我只是在 Firefox 中打开本地 .html 文件，样式表切换似乎无法按预期工作。但是，如果我运行一个网络服务器并通过 localhost 打开同一个文件，样式表切换确实有效。

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

python -m SimpleHTTPServer 8000

然后，当我在 Firefox 地址栏中输入 localhost:8000 后，样式表替代项正确显示在“查看 > 页面样式”菜单下（与在地址栏中输入 file:///{path}/index.html 相反）。

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

【讨论】：