• 浏览器端兼容性解决方案


    自从微软停止对XP的支持后

    对我们WEB开发者来说是一种很大的解脱,因为不用再去兼容IE67了,为什么也要包含7呢,因为VISTA的市场占有率不足1%,几乎可以忽略不计

    这个时候市面上所有浏览器中,完全不兼容HTML5的就只有一款,IE8,如果想着IE8什么时候被微软抛弃就好了,这个是绝对不可能的,因为windows7的系统支持,至少要持续到2018年,那个对现在来说还是太久远

    所以、所以我们就要实行一种采取HTML5+CSS3搭建,但是兼容Ie8的解决方案,这样可以在IE8被微软抛弃后,更快捷的抛弃它,而且,最最重要的是CSS3的选择器能够替代很多冗余的JS代码,使得代码更简练

    代码直接贴上

     1 <!DOCTYPE html>
     2 <!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
     3 <!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
     4 <!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
     5 <!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
     6   <head>
     7     <meta charset="utf-8">
     8     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     9     <title></title>
    10     <meta name="description" content="">
    11     <meta name="viewport" content="width=device-width, initial-scale=1">
    12     <link rel="stylesheet" href="css/style.css">
    13     <!--[if lt IE 9]><script src="js/vendor/selectivizr-1.0.2.min.js"></script><![endif]-->
    14     <!--兼容css3选择器-->
    15     <!--[if IE]>   
    16     <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>  
    17     <![endif]--> 
    18     <!--兼容html5标签 -->
    19     <script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>
    20     <!--兼容性检测-->
    21     <style>
    22     p:first-letter{background:red}
    23     </style>
    24   </head>
    25   <body>
    26     <!--[if lt IE 9]>
    27       <div class="browsehappy">
    28         <p>
    29           You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/" target="_blank">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true" target="_blank">activate Google Chrome Frame</a> to improve your experience.
    30         </p>
    31       </div>
    32     <![endif]-->
    33 
    34 
    35 
    36     <!--[if lt IE 9]>
    37       <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    38       <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.0.min.js"></script>')</script>
    39     <![endif]-->
    40     <!--[if gt IE 8]><!-->
    41       <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
    42       <script>window.jQuery || document.write('<script src="js/vendor/jquery-2.1.0.min.js"></script>')</script>
    43     <!--<![endif]-->
    44     <script src="js/plugins.js"></script>
    45     <script src="js/main.js"></script>
    46   </body>
    47 </html>
     
  • 相关阅读:
    用mobiscroll.js如何简单使用日期控件
    Easyui的datagrid的行编辑器Editor中添加事件(修改某个单元格带出其他单元格的值)
    运行网站项目时,有时出现Bad Request,该怎么解决?
    Easyui的datagrid的editor(行编辑器)如何扩展datetimebox类型
    JQuery对象和DOM对象的区别与转换
    【转发】Cookie存储的值大小限制和个数问题
    【转发】centos 7开启FTP以及添加用户配置权限,只允许访问自身目录,不能跳转根目录
    Vim 保存和退出命令
    CentOS下防御或减轻DDoS攻击方法(转)
    CentOS 7 firewalld vsftpd开放端口
  • 原文地址:https://www.cnblogs.com/fly-dog/p/3713082.html
Copyright © 2020-2023  润新知