HTML兼容IE版本问题

最新推荐文章于 2021-06-09 20:30:45 发布

youcey

最新推荐文章于 2021-06-09 20:30:45 发布

阅读量2.1k

点赞数 1

分类专栏： html IE版本文章标签： html ie

本文链接：https://blog.csdn.net/yangye1225/article/details/55506056

版权

html 同时被 2 个专栏收录

3 篇文章 0 订阅

订阅专栏

IE版本

3 篇文章 0 订阅

订阅专栏

1、这个的不同版本根据个人的需求而定。其中.no-css3用来表示 ie6-8不支持css3的样式，对于渐进增加方面，可以高级浏览器使用css3，ie6-8使用.no-css3这个class来定位使用背景图片，而对于ie8支持的:before和:after生成的三角，则可以使用.lt7来表示ie7及ie6使用背景图片。

<!DOCTYPE HTML>
<!--[if !IE]><!--><html lang="zh-cn"><!--<![endif]-->
<!--[if gt IE 9]><html class="ie10" lang="zh-cn"><![endif]-->
<!--[if IE 9]><html class="ie9 lte9" lang="zh-cn"><![endif]-->
<!--[if IE 8]><html class="ie8 lte9 no-css3" lang="zh-cn"><![endif]-->
<!--[if IE 7]><html class="ie7 lte9 lte7 no-css3" lang="zh-cn"><![endif]-->
<!--[if lte IE 6]><html class="ie6 lte9 lte7 no-css3" lang="zh-cn"><![endif]-->
<head>
  <meta charset="UTF-8">
  <title></title>
</head>
<body>
  
</body>
</html>

2、下面的针对于IE6的情况排序，然后对非IE6，IE7，IE8进行了判断

<!DOCTYPE HTML>
<!--[if lte IE 6]><html class="ie6 lte7 no-css3" lang="zh-cn"><![endif]-->
<!--[if IE 8]><html class="ie8 no-css3" lang="zh-cn"><![endif]-->
<!--[if IE 7]><html class="ie7 lte7 no-css3" lang="zh-cn"><![endif]-->
<!--[if !(IE 6) | !(IE 7) | !(IE 8)  ]><!--><html lang="zh-cn"><!--<![endif]-->
<head>
  <meta charset="UTF-8">
  <title></title>
</head>
<body>
  
</body>
</html>

3、添加ie9，把no-css3 class改成lte8

<!DOCTYPE HTML>
<!--[if IE 6]><html class="ie6 lte9 lte8 lte7" lang="zh-cn"><![endif]-->
<!--[if IE 8]><html class="ie8 lte9 lte8" lang="zh-cn"><![endif]-->
<!--[if IE 9]><html class="ie9 lte9" lang="zh-cn"><![endif]-->
<!--[if IE 7]><html class="ie7 lte9 lte8 lte7" lang="zh-cn"><![endif]-->
<!--[if !(IE 6) | !(IE 7) | !(IE 8) | !(IE 9)  ]><!--><html lang="zh-cn"><!--<![endif]-->
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>

</body>
</html>

4、在实际应用中相对比较简单

<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie6" lang="zh-cn"><![endif]-->
<!--[if IE 7 ]><html class="ie7" lang="zh-cn"><![endif]-->
<!--[if IE 8 ]><html class="ie8" lang="zh-cn"><![endif]-->
<!--[if IE 9 ]><html class="ie9" lang="zh-cn"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html class="" lang="zh-cn"><!--<![endif]-->