zoukankan      html  css  js  c++  java
  • 关于常见IE兼容插件的研究

    1、html5shiv.js html5.js

    适用浏览器:IE 6 7 8 

    目的:让低版本IE浏览器(678)支持html5新增的标签

    使用方法:

    <!--[if lt IE 9]>
    <script src="dist/html5shiv.min.js"></script>
    <![endif]-->
    

    尽量使用压缩过的js,在body标签之前加载

    原理:

    使用createElement方法,这包含document.createElement和document.createDocumentFragment,对当前页面的HTML5元素进行动态的调整,并且为这些元素提供最基本的样式。

    html5新增的标签有哪些?

    abbr, article, aside, audio, canvas, datalist, details, dialog, eventsource, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, time, video

    代码原理分析:

    js

    <!--[if lt IE9]> 
    <script> 
       (function() {
         if (! 
         /*@cc_on!@*/
         0) return;
         var e = "abbr, article, aside, audio, canvas, datalist, details, dialog, eventsource, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, time, video".split(', ');
         var i= e.length;
         while (i--){
             document.createElement(e[i])
         } 
    })() 
    </script>
    <![endif]-->
    

    css

    /*html5*/
    article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
    

    相当于调用浏览器的创建元素的功能,并把它设置为block

     2、respond.js

    适用浏览器:IE 6 7 8 

    Respond.js 是一个快速、轻量的 polyfill,用于为 IE6-8 以及其它不支持 CSS3 Media Queries 的浏览器提供媒体查询的 min-width 和 max-width 特性,实现响应式网页设计(Responsive Web Design)。

    WARNING: Respond.js doesn't work if you view the page via file:// 

    即本地文件路径下查看,是不支持的

     3、ie-css3.htc

    适用浏览器:IE 6 7 8 

    目的:让IE 678 浏览器支持css3属性。包括:border-radius,box-shadow,text-shadow

    使用方法:

    .box {
      -moz-border-radius: 15px; /* Firefox */
      -webkit-border-radius: 15px; /* Safari 和 Chrome */
      border-radius: 15px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
    
      -moz-box-shadow: 10px 10px 20px #000; /* Firefox */
      -webkit-box-shadow: 10px 10px 20px #000; /* Safari 和 Chrome */
      box-shadow: 10px 10px 20px #000; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */
    
      behavior: url(ie-css3.htc); /* 通知IE浏览器调用脚本作用于'box'类 */
    }

    注意:.htc 文件路径是相对于html文件的路径,而不是相对于css文件。(相关研究↘)

    简介:IE浏览器的behavior 属性是相对于HTML文档而言的,与CSS其他的属性不一样,不是相对于CSS文档而言的。

    要想让IE浏览器支持htc文件,需要一个有着”text/x-component” 字样的content-type 头部,否则,会忽视behavior。

    原理:.htc是个脚本文件,类似于js。但(貌似)只有ie认他。htc利用vml结合脚本画css3的特效。

    备注:VML是The Vector Markup Language(矢量可标记语言)的缩写。VML用于将图形数据矢量化的标记语言。是一种基于 XML 语法的语言。

    代码原理分析:略

    大神博客相关文章:http://www.zhangxinxu.com/wordpress/2010/04/让ie6ie7ie8浏览器支持css3属性/

    让IE6/IE7/IE8支持CSS3的8种方法:http://blog.csdn.net/debugingstudy/article/details/11913497

    ------------------格式

     n、name.js

    适用浏览器:

    目的:

    使用方法:

    原理:

    代码原理分析:

    ------------------ps,看看就得了,这年头谁还去兼容ie678啊,ie10都被微软强制弹窗升级ie11了。ie11都被微软放弃开发去搞edge了。有病啊,研究这个。真闲的蛋疼,为edge多多做做优化帮助微软快速翻身干掉ie比这个强

  • 相关阅读:
    Android:真机调试遇到的问题(INSTALL_FAILED_CANCELLED_BY_USER和INSTALL_FAILED_INSUFFICIENT_STORAGE)
    tips:Java中的switch的选择因子
    tips:可变参数列表
    tips:Java中while的判断条件
    tips:Java的Random类和Random函数
    tips:Java基本数据类型大小比较
    怎样找到微信小程序功能呢?
    ajax和jquery
    json及JavaBean转json
    JavaBean转xml
  • 原文地址:https://www.cnblogs.com/ferron/p/5438230.html
Copyright © 2011-2022 走看看