IE10的CSS技巧

文章出自：IT屌丝-码农之家

微软宣布IE10 将不支持条件注释。他们的历史，这显然是一个冒险的举动。截至目前，针对古怪的行为在IE6-9，开发人员已经使用条件的意见，有条件的类，以及其余IE特定的hack。

可是，若是没有条件在IE10的意见，惟一的选择，咱们针对CSS问题是Hack或浏览器嗅探 - 咱们固然不但愿诉诸后者留下。

IE10专门使用一个Hack。下面是这技术的总结，供参考。

方法1:
特征检测@ cc_on
脚本里面是不包括一个IE的条件注释，以确保IE6-9不认可它，那么它的特色是检测一种叫作 @ cc_on 。在这里，它是：

1. <!--[if !IE]><!--><script>  
   
2. if (/*@cc_on!@*/false) {  
   
3.     document.documentElement.className+=' ie10';  
   
4. }  
   
5. </script><!--<![endif]-->  

复制代码

请注意/*@cc_on ! @*/中间的这个感叹号；这样就能够在ie10中给html元素添加一个class=”ie10″。而后在你的CSS，只须要使用“IE10”类：

1. .ie10 .example {  
   
2.    /* IE10-only styles go here */  
   
3. }  

复制代码

好吧，其实不知道IE11会不会继续支持这个私有语句，若是是的话，就比较难区分IE10和IE11了。

须要注意的是，条件编译不支持Windows Store中的App中使用，只支持在IE10浏览器中使用。

固然，咱们也能够用传统的用ua给IE10中html元素添加class的方法来实现。

方法2:
@media -ms-high-contrast Hack
IE10支持媒体查询，也支持-ms-high-contrast这个属性，因此，咱们能够用它来hack IE10：

1. @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
   
2.    /* IE10-specific styles go here */  
   
3. }  

复制代码

最终这一条多是最好的选择，但也许不是如今。最后，IE9用户都应该获得通知经过Windows Update升级到IE10。这应该是包括Windows 7用户。若是发生这种状况，IE9的市场份额最终将被接管的IE10，以一样的方式发生这种状况与其余浏览器自动更新。

除此以外，若是这个分析错误是固定的IE11，那么，这意味着它也将是将来的证实。但咱们不会知道，直到被释放IE11。

方法3:
@media Zero Hack
这个有些BT了，并且不是很完美，由于IE9也支持media，也支持\0这个hack：

1. @media screen and (min-width:0\0) {  
   
2.     /* IE9 and IE10 rule sets go here */  
   
3. }

复制代码

如今的windows 7中的ie9已经能够升级到ie10了，相信要不了多久IE10就会代替IE9;