css - Chrome 开发工具将链接标签替换为样式标签

Question

我在使用 Chrome 开发工具时遇到了一个奇怪的问题:

• 在我正在开发的 Web 应用程序中，HTML header 中的 CSS link 标记在 elements 选项卡 中显示时转换为 style> CDT 的
• 在其他网站上，链接标签在 CTD 中正确显示。

示例:

• 在 HTML 中(使用 ctrl+u )我明白了:

<link href="./style/css/lib/jquery-ui-1.10.3.custom.css" rel="stylesheet" type="text/css">
<link href="./style/css/lib/bootstrap.css" rel="stylesheet" type="text/css">

• 在 CDT 的元素选项卡中，我得到:

这对我来说是个大问题，因为如果样式不包含在链接标签中，我就无法将样式链接到本地​​文件。

所以问题是:为什么会这样？以及如何强制 CDT 通过原始链接标记来解释样式？

Answer 1

经过几个小时的研究，我发现库 prefixfree ( http://leaverou.github.io/prefixfree/ ) 是造成这种情况的原因。

它从链接文件中获取 CSS，对其进行修改，最后将其放回脚本标签中。