If-IE mixin 没有通过 CSS 验证器

Question

所以我对前端开发很陌生。我现在正在学习大约 4 到 5 个月的课程。但我有点坚持使用 IE mixin。 mixin if-IE mixin 效果很好，请参阅：

@mixin if-ie {
@media screen and (min-width:0\0) {
    @content;
 }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active {
    @content;
 }
}

但是当我在 W3C 验证器中检查 css 输出时，它会吐出 3 个错误：

• 未知维度 0\0
• 解析错误) { .transparent { 填充：#FFC0CB; }}
• 所有媒体均不存在功能 -ms-high-contrast ),(-ms-high-contrast: active) { .transparent { fill: #FFC0CB; } }

我在互联网上看到其他开发人员使用这种类型的 mixin，我的同事甚至在工作中使用它。所以我有两个问题：

1. 当它不是有效的 CCS 时，为什么有这么多人使用它？
2. 有没有办法让这个 mixin 成为有效的 CSS？

谢谢！

Answer 1

关于您的解析错误：括号应在第二个选择器的末尾关闭：

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  /* */
}

他们是黑客。
CSS hack 的第一条规则是你不应该使用它们。
第二条规则是，如果你真的需要它们，那么，选择那些被认为比 UA 字符串检测更强大的那些，比如 BrowserHacks 中的那些：

提醒！
请记住，使用 hack 并不总是完美的解决方案。修复一些奇怪的浏览器特定错误可能很有用，但在大多数情况下，您应该修复 CSS/JS 或使用feature detection。

黑客攻击主要基于来自某些版本的浏览器（如 0\0）或非标准属性（如 -ms-high-contrast）的一些解析错误。现代浏览器会按预期识别有效的 CSS，因此您不能使用 that 将样式应用于某些浏览器而不是其他浏览器。

1.当它不是有效的CCS时，为什么有这么多人使用它？

他们不知道更好，或者他们确实知道，但确实需要将 IE10/11 与其他人或 Safari 或 Chrome 或 Firefox 设计不同的样式，并且他们不想仅通过 1 次 hack 加载 Modernizr（如果有可能存在许多差异）。
有效的 CSS 是一种以定性方式完成工作的非常好的方法，但它本身并不是目标。页面不一定会像格式错误的 XML 那样中断。

有没有办法让这个 mixin 成为有效的 CSS？

你想达到什么目的？你没有告诉我们为什么你需要特别为 IE 修改样式（有很多原因......）。
@supports 或 Modernizr 可能是一个更好的解决方案，或者可能不是：这取决于，像往常一样在前面-世界末日。