我正在查看 this 的源代码地点。当您向下滚动时，页面会根据您当前的滚动位置而变化 - 产生很好的效果。
查看 FireFox 中页面的源代码，我注意到他们使用 -webkit-transform:matrix(a, b, c, d, 0, 0);处理div的移动。然而，当在 IE 中查看相同的源时，它仅显示为 transform: matrix(a, b, c, d, 0, 0);这些样式属性内联并显示如下:
火狐:
<div class="card gift" style="z-index: 0; -webkit-transform: matrix(a, b, c, d, 0, 0); right: 198px; top: 323px; opacity: 1;"></div>
IE:
<div class="card gift" style="z-index: 0; transform: matrix(a, b, c, d, 0, 0); right: 198px; top: 323px; opacity: 1;"></div>
在前面的所有示例中，a , b , c和d都是基于当前滚动位置的动态变量。
我查看了this发布关于条件CSS的SO，但他们没有提到内联样式，如上面的代码所示。
这样的事可以做吗？我已尝试以下方法，但无济于事( fiddle here ):
<div class="testing" style="<!--[if IE]>background-color: #321;<!--[if !IE]> -->background-color: #F00;<!-- <![endif]-->"></div>
如果内联条件CSS是不可能的，那么他们如何根据浏览器更改内联样式？我最好的猜测是 JavaScript 在页面加载后添加属性，作为滚动位置的函数。
谢谢。
编辑:
查看提供的链接，它们包括
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if IE 9]> <html class="no-js lt-i10 ie9"> <![endif]-->
<!--[if gt IE 9]><!--> <html class="no-js"> <!--<![endif]-->
在他们的页面顶部，这几乎与我提供的 SO 链接中的答案之一相同。但我不太确定这些代码行的作用。这是解决方案的一部分吗？
再次感谢。
最佳答案
我认为不，您不能使用Conditional-CSS作为内联。
但是如果你想根据浏览器指定 css 样式，这里有一些 css-hacks 可用:
关于javascript - 适用于 IE 和其他浏览器的条件内联 CSS？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21466047/