低版本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">
低版本IE兼容 H5+CSS3 方案的更多相关文章
- HTML data属性简介以及低版本浏览器兼容算法
实例 使用 data-* 属性来嵌入自定义数据: <ul> <li data-animal-type="bird">Owl</li> <l ...
- 低版本Flume兼容高版本elasticsearch
Flume更新比较慢,而elasticsearch更新非常快所以当涉及更换elasticsearch版本时会出现不兼容问题. apache-flume-1.6.0+elasticsearch1.5.1 ...
- 低版本系统兼容的ActionBar(二)ActionProvider+分离式ActionBar+分离式的ActionMode
这篇文章主要讲的是在低版本兼容的ActionBar中实现自定义的ActionProvider,ShareActionProvider的使用方法,如何实现分离式ActionBar,外加在分 ...
- 低版本系统兼容的ActionBar(一)设置颜色+添加Menu+添加ActionMode
之前我一直用ActionBarSherlock这个开源项目来做ActionBar,因为它可以让低版本的设备也能用上ActionBar.但是在最新的SDK中Google提供了一个AppCompa ...
- angularjs1+requirejs+ bootstrap+ jQuery低版本配合兼容ie8+浏览器
angularjs兼容低版本IE浏览器(IE8)angularjs在1.3之后的版本都是选择放弃对IE8及更低IE版本的支持,但是就目前的开发形式来看,IE8的使用客户还是蛮多的,最近有个项目要求尽量 ...
- 整理低版本ie兼容问题的解决方案
CSS hack \9 所有的IE10及之前 * IE7以及IE7以下版本的 _ IE6以及IE6以下版本的 !important 提升样式优先级权重 1.ie6,7 ...
- 低版本ie兼容问题的解决方案
CSS hack \9 所有的IE10及之前 * IE7以及IE7以下版本的 _ IE6以及IE6以下版本的 !important 提升样式优先级权重 1.ie6,7 ...
- 低版本系统兼容的ActionBar(六)用Fragment+ViewPager+Tab实现快速导航
Tab经常和Fragment结合使用,这一讲我们用3种方式来实现这种快捷导航. 0.重要的两个监听器 MyTabListener,这个我们之前已经接触过了 package com.kale.actio ...
- IE低版本浏览器兼容问题
head标签中填写如下代码 <meta name="renderer" content="webkit"/> <meta name=" ...
随机推荐
- strcpy strlen 实现
1. strcpy:字符串拷贝函数,无边界,一直拷贝到字符串结束符 '\0' 为止. char* strcpy(char* strDest, const char* strSrc); 代码实现: #i ...
- Python入门(一) 异常处理
异常处理 捕捉异常可以使用try/except语句. try/except语句用来检测try语句块中的错误,从而让except语句捕获异常信息并处理. 以下是语法: try: <语句> # ...
- Hive入门(二)分区
1 基本概念 1.1 什么是分区 Hive查询中一般会扫描整个表内容,会消耗很多时间.有时候只需要查询表中的一部分数据,因此建表时引入了partition(分区)概念. 表中的一个 Partition ...
- Maven打包成Jar文件时依赖包的问题
我们项目中使用到第三方的库文件,这些jar库文件并没有放到Maven中央库上,导致我们需要在项目中自己配置使用.我们的两三个开发人员对Java都是很熟,因此在使用中遇到了一些问题,表现在:在本地中引入 ...
- 生产Server遭挖矿程序入侵,暴力占用CPU
区块链的火热,利益驱使必然导致不少PC或Server,被变成肉鸡,执行挖矿程序进行挖矿,进而导致我们正常的程序无法正常. (Centos7 Server)使用top命令查看服务器进程运行情况,发现几个 ...
- 个人永久性免费-Excel催化剂功能第74波-批量排版格式利器,瞬间美化表格
PPT和WORD的世界,充满着排版的美化操作,在Excel世界同样也需要对表格.图表的美化,此篇带你进入真正的制表专家行列,使用Excel催化剂的格式管理增强功能加上对美感的艺术造诣,对Excel表格 ...
- 简易数据分析 07 | Web Scraper 抓取多条内容
这是简易数据分析系列的第 7 篇文章. 在第 4 篇文章里,我讲解了如何抓取单个网页里的单类信息: 在第 5 篇文章里,我讲解了如何抓取多个网页里的单类信息: 今天我们要讲的是,如何抓取多个网页里的多 ...
- 原生 js基础常用的判断和循环
原生 js基础常用的判断和循环 以下部分是个人实践及和搜集的资料: 最常用的if判断语句: if (/* 条件表达式 */){ // 成立执行语句 } else { // 否则执行语句 } 原生js的 ...
- ArcGIS API For JavaScript 开发(二)基础地图
有了开发环境,接下来的就是实践了,实践是检验真理的唯一标准! 多多练习,不要觉得自己能够想的出来就万事大吉了,还是得动手做才是最好的检验自己的能力. 基础地图,本节将通过arcgis api for ...
- 172. 阶乘后的零 Java解法
https://leetcode-cn.com/problems/factorial-trailing-zeroes/ 172. 阶乘后的零 这题要完成其实要知道一个很巧妙的思想,就是阶乘里面,后面的 ...