zoukankan      html  css  js  c++  java
  • html兼容ie浏览器的写法

    <!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>

    这个其实有好几种不同的版本,按个人的需求来定吧,本人在不同阶段也使用了不同的版本,最终确认为这个版本。其中.no-css3用来表示 ie6-8不支持css3的样式,对于渐进增加方面,可以高级浏览器使用css3,ie6-8使用.no-css3这个class来定位使用背景图片,而 对于ie8支持的:before和:after生成的三角,则可以使用.lt7来表示ie7及ie6使用背景图片。

    再次更新下,因为考虑到国内浏览器还是ie6比较多,所以把顺序排列了下,然后只针对非ie6,7,8进行判断

    <!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>

    2013-01-05更新:添加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>

    以上是网上转发的,咱们实际使用中的可以考虑的更简单

    <!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]-->

    这样就可以了,例如当类a某个样式在ie8上有问题时,就可以写成

    .ie8 .a{}
  • 相关阅读:
    redis单机安装以及简单redis集群搭建
    Linux中JDK安装教程
    微信公众号开发(一)
    easyui多图片上传+预览切换+支持IE8
    mybatis动态sql之foreach标签
    java List递归排序,传统方式和java8 Stream优化递归,无序的列表按照父级关系进行排序(两种排序类型)
    java钉钉通讯录同步
    java使用poi生成导出Excel(新)
    java 图片转base64字符串、base64字符串转图片
    Spring事务mysql不回滚:mysql引擎修改
  • 原文地址:https://www.cnblogs.com/snowbaby-kang/p/3992971.html
Copyright © 2011-2022 走看看