css - Chrome 将 css 文件渲染为元素检查器中的样式标签

Question

Chrome 版本:44

在我的正常开发环境(C#、IIS Express)中工作时，浏览器下载的 css 文件在源选项卡中可用，我可以在元素检查器中查看哪些样式来自哪些文件。但是，在我当前的开发环境(PHP、Apache、Xammp)中。样式表正在下载并呈现为样式标签，并且在源选项卡中不可用。这很烦人，因为我无法将本地编辑的样式保存到我的工作副本中。我以前从未见过这个，而且似乎无法通过快速谷歌找到任何答案。有谁知道什么会导致开发工具以这种方式呈现？我觉得这一定是某种服务器配置问题，但我不能确定。下面的例子:

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

呈现为:

在元素检查器中看起来是这样的:

非常感谢任何帮助!

Answer 1

我刚遇到同样的问题。不确定我的案例是否可以解决您的问题，但我发现我有一个脚本“prefixfree”在加载时请求冗余的 css 文件。所以我只是注释掉了这一行，我在 Element Inspector 中的风格就恢复了正常。

<script src="~/Scripts/prefixfree-1.0.7.js"></script>