低版本ie模式 360兼容模式的兼容性调节以及控制代码

IE10/11不支持条件性注释后的3种替代方法：

方法一：使用IE=EmulateIE9属性指示浏览器采用IE9渲染技术

IE9是支持条件性注释的。

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">

在html网页的head里加入上面的元标记，这样IE10/11就能识别条件性注释了，我们也就可以像IE6/7/8那样编写针对性的CSS代码了。但这样做有个弊端，很显然，浏览器这样就会开启IE9的渲染模式，而不是最新的IE10/11技术。

方法二：使用媒体查询语句+-ms-high-contrast属性

CSS 的媒体查询语句(media query)是一种高级的CSS条件语句，它能根据一些属性和属性值计算判断CSS是否可以生效。在这里，我们要使用一个IE10/11独有的属性，它就 是-ms-high-contrast，只有IE10/11实现了这个属性，它可以有两个值active或none，使用下面的媒体查询语句：

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
}

火狐浏览器、谷歌浏览器不能识别这个属性，所以不会执行这个查询语句里的CSS，从而实现了条件性执行的效果。

方法三：使用Javascript判断浏览器的类型

先用JavaSCript判断是否是IE浏览器，如果是，就在页面的<html>标记上添加一个“ie”的类名：

var ms_ie = false;
var ua = window.navigator.userAgent;
var old_ie = ua.indexOf('MSIE ');
var new_ie = ua.indexOf('Trident/');
    
if ((old_ie > -1) || (new_ie > -1)) {
    ms_ie = true;
}
    
if ( ms_ie ) {
   document.documentElement.className += " ie";
}

 

IE6兼容性

 

 

解决低版本浏览器不支持css3和html5新特性的利器  ---

Modernizr——为HTML5和CSS3而生！

附，Modernizr检测清单：

1. @font-face
2. Canvas
3. Canvas Text
4. WebGL
5. HTML5 Audio
6. HTML5 Audio formats
7. HTML5 Video
8. HTML5 Video formats
9. rgba()
10. hsla()
11. border-image
12. border-radius
13. box-shadow
14. text-shadow
15. Multiple backgrounds
16. background-size
17. opacity
18. CSS Animations
19. CSS Columns
20. CSS Gradients
21. CSS Reflections
22. CSS 2D Transforms
23. CSS 3D Transforms
24. Flexible Box Model
25. CSS Transitions
26. Geolocation API
27. Input Types
28. Input Attributes
29. localStorage
30. sessionStorage
31. Web Workers
32. applicationCache
33. SVG
34. Inline SVG
35. SVG Clip paths
36. SMIL
37. Web SQL Database
38. IndexedDB
39. Web Sockets
40. hashchange Event
41. History Management
42. Drag and Drop
43. Cross-window Messaging
44. Touch Events
posted @ 2016-11-10 11:04  HALEY168  阅读(1629)  评论(0)  编辑  收藏  举报