css - 只有部分 CSS 文件被加载到 Chrome 中

Question

出于某种原因，我的页面只加载了一部分(大约 1/3 的 CSS 文件)。它是一个连接和缩小的。如果我去 http://staging.easyuniv.com/styles/dbf42ab5.main.css 我可以看到整个事情。

最奇怪的是，如果查看 Chrome Dev Tools 中的源代码，大约三分之一的地方会变成空白(就在类名的中间)，但是你可以滚动剩下的部分，就好像文本在那里。

我正在使用以下内容将它加载到我的页面上:

<link rel="stylesheet" href="styles/dbf42ab5.main.css">

有人遇到过这样的事情吗？我已经没有什么可以尝试的了。

Answer 1

该文件是 far from valid，可能应该查看，但这是我发现的……

• 我无法将您的 CSS 文件的内容粘贴到 http://cssbeautify.com/ - CSS 在与 Chrome 正在做的几乎相同的地方被截断
• 我可以粘贴到 http://www.codebeautifier.com/，它可以生成一个可以正常加载的 CSS 文件!很奇怪。

通过一些试验和错误，使用 Chrome 开发者工具时，在一行 连接的 CSS 文件看起来像是被切断了。该文件似乎已被解析为使用 Ctrl+Shift+F 并在文件末尾搜索内容(我正在搜索zag-divider) 然后 Chrome 报告它已找到，尽管找到的计数似乎是错误的。

具体来说，似乎该 CSS 文件中 >= 66,537 个字符的任何行 都将被截断!例如:

• 单行 CSS 文件 <= 66,536 个字符不会被截断
• 单行 CSS 文件 >= 66,537 个字符将被截断
• 多行 CSS 文件 >= 66,537 个字符将只有 >= 66,537 个字符的行将被截断

我有一行恰好 66,537 个字符的 CSS 被截断了，但是通过在第一个选择器后添加一个回车并重新加载，整个文件在控制台中正确显示。

所以总而言之……一个 CSS 文件的任何行 >= 66,537 个字符看起来像是在 Chrome 开发者工具中被截断了，尽管该文件实际上已经完全加载了。我通过在 Chrome 应用的行末尾添加一条规则来对此进行测试。

注意:如果看似神奇的数字是 2¹⁶，我会更开心

编辑:调查在 Chrome 23.0.1271.97 m 上进行