zoukankan      html  css  js  c++  java
  • 低版本IE兼容 H5+CSS3 方案

    【主要是针对ie6 7 8对支持和让老浏览器支持html5+css3的一些js脚本】

    html5shiv.js             

    // 让IE8及耕地版本的IE识别section,article,nav等html5元素

    cdn地址:

    <script src="https://cdn.bootcss.com/html5shiv/r29/html5.min.js"></script>

    注意:都要初始化新标签的CSS.因为HTML5在默认情况下表现为内联元素,对这些元素进行布局我们需要利用CSS手工把它们转为块状元素方便布局

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

    但是如果ie6/7/8 禁用脚本的用户,那么就变成了无样式的"白板"网页,我们该怎么解决呢?

    我们可以参照facebook的做法,即引导用户进入带有noscript标识的 “/?_fb_noscript=1”页面,用 html4 标签替换 html5 标签,这要比为了保持兼容性而写大量 hack 的做法更轻便一些。

    selectivizr(www.selectivizr.com)              

    // 让IE6/7/8支持 ::first-child等高级css选择符

    cdn地址:

    <script src="https://cdn.bootcss.com/selectivizr/1.0.2/selectivizr-min.js"></script>

    IE9.js(http://www.9416.cn/html/support/254.html)              

    // 修复从IE6-IE9的很多bug和缺损功能

    CSS3Pie(www.css3pie.com)              

    // 让IE6-IE9支持圆角,背景渐变,边框图片,盒子阴影,RGBa颜色可视化的css3功能

    cdn地址:

    <script src="https://cdn.bootcss.com/css3pie/2.0beta1/PIE_IE9.js"></script>

    Respond.js(www.github.com/scottjehl/respond)              

    // 让旧版浏览器支持媒体查询

    cdn地址:

    <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>

    -prefix-free(lea.verou.me/projects)              

    // 为需要厂商前缀的css3声明添加前缀

    cdn地址:

    <script src="https://cdn.bootcss.com/prefixfree/1.0.7/prefixfree.min.js"></script>

    -borderBoxModel.js(www.github.com/albertogasparin/borderBoxModel              

    // 让IE6和IE7支持CSS3的box-sizing属性

    基于CSS3 flexbox规范的网格样式

    <link href="https://cdn.bootcss.com/flexboxgrid/6.3.1/flexboxgrid.min.css" rel="stylesheet">
  • 相关阅读:
    layer 弹出层 回调函数调用 弹出层页面 函数
    jquery 封装页面之间获取值
    ZTree 获取选中的项
    动态拼接SQL 语句
    翻译-使用Spring调用SOAP Web Service
    分享最新的博客到LinkedIn Timeline
    翻译-使用Spring WebService生成SOAP Web Service
    在Gradle中使用jaxb的xjc插件
    Gradle中的buildScript代码块
    健身4个月总结
  • 原文地址:https://www.cnblogs.com/One-sprite/p/8504751.html
Copyright © 2011-2022 走看看