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

Question

Chrome版本：44

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

null

呈现为：

在元素检查器中看起来如此：

任何帮助都非常感谢！

Answer 1

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

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

Answer 2

在我的情况下，问题似乎是由应用于目标元素的错误/格式错误的CSS样式引起的。删除此样式后，我可以正常访问元素的样式：

background: -webkit-gradient(linear,0% 0%, 0% 100%, from(#2521BC), to(#1C1957), color-stop(.5,#3A33E7));