起初，IE其实也是一款非常有进取心的浏览器。但经过一段时间的蛰伏后，它已经成为了我们生活中的一道障碍。微软现在又重新开始向其它浏览器发起挑战，但事实情况是，新版的现代IE浏览器一直滞后于谷歌浏览器和火狐浏览器。我们还不得不想办法兼容早期的IE浏览器。下面提到的三种方法能快捷轻松的让你的HTML5&CSS3网站在微软的主要浏览器中也能神奇的运行！

　　htmlshiv.js

　　Remy开发的HTML5shiv工具能利用JavaScript在老式IE里创建main，header，footer等HTML5元素。也就是说使用JavaScript能创建这些本来不存在的HTML5新元素。这是什么原理？你可能花几天也想不明白，但谁在意呢！这个脚本几乎是所有正式网站必用的js。

<!--[if lt IE 9]>

<script src="dist/html5shiv.js"></script>

<![endif]-->
　　selectivizr.js

Selectivizr.js是一款神奇的工具，它能提供大量IE不支持的CSS选择器和属性，包括所有的last-child选择器。最近在网站改版过程中，我使用了selectivizr，网站竟然可以毫不走样的在老式IE浏览器的正常显示。下面是我使用的代码片段：

<!--[if lte IE 8]><script src="js/libs/selectivizr.js"></script><![endif]-->

　　现代新技术WEB项目不可缺少的js库。它只会在老式IE里加载。

　　<html>条件判断注释

　　你一定见到过这种极其丑陋的条件判断注释。然而，丑虽丑，它却能让你的网页能按你希望的方式运行：

<!DOCTYPE html>

<!--[if lt IE 7 ]> <html class="ie6 lazy " lang="en"> <![endif]-->

<!--[if IE 7 ]>    <html class="ie7 lazy " lang="en"> <![endif]-->

<!--[if IE 8 ]>    <html class="ie8 lazy " lang="en"> <![endif]-->

<!--[if IE 9 ]>    <html class="ie9 lazy " lang="en"> <![endif]-->

<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en"> <!--<![endif]-->

　　这段代码不需要JavaScript，不需要等待JavaScript的加载，你定义的CSS样式会立即生效起作用，没有那种因为加载延迟而出现的样式闪变。

　　虽然IE在奋起直追它的那些竞争对手，但现实情况是老式的IE浏览器仍然相当普遍，特别是在那些发展中国家。欣慰的是，上面的这些工具在所有浏览器里都可以使用。

让你的HTML5&CSS3网站在老IE中也能正常显示的3种方法的更多相关文章

  1. HTML中的IE条件注释，让低版本IE也能正常运行HTML5+CSS3网站的3种解决方案

    最近的项目中,因为需要兼容IE7,IE8,IE9,解研究了IE的条件注释,顺手写下来备忘.  HTML中的IE条件注释 IE条件注释是一种特殊的HTML注释,这种注释只有IE5.0及以上版本才能理解. ...

  2. 12款非常精致的免费 HTML5 & CSS3 网站模板

    01. Joefrey Mahusay 很炫的单页网站模板,基于 HTML5 & CSS3 制作,适合用于设计师个人简历.摄影师和平面设计师的个人作品展示. 演示  下载 02. Folder ...

  3. 12个新潮的 HTML5 & CSS3 网站设计欣赏

    响应式设计和基于 HTML5 & CSS3 编码的网站是为网站制作的理想解决方案. HTML5 & CSS3 制作出来的网站结构良好,有很多惊人的效果,并能够在任何设备上浏览. 今天, ...

  4. 12款界面精美的 HTML5 & CSS3 网站模板

    这里分享的12款完全采用响应式设计的 HTML5 & CSS3 网站设计模板.每一个细节都精心设计,以创建一个美妙的用户体验.这些响应主题和模板最适合用于电子商务,商业门户网站,个人作品集以及 ...

  5. 16个时髦的扁平化设计的 HTML5 & CSS3 网站模板

    创建网站最好办法之一是使用现成的网站模板或使用开源 CMS 应用程序.所以,今天这篇文章给大家带来的是16款基于 HTML5 & CSS3 的精美的扁平风格网站模板,大家可以借助这些优秀的网站 ...

  6. 12款高质量的响应式 HTML5/CSS3 网站模板

    HTML5 已经成为众所周知的语言,大量的 HTML5 资源和工具正在建立,以帮助开发人员和设计人员.今天,我们展示12款免费的响应式 HTML5/CSS3 网站模板,帮助你创建醒目和视觉震撼的网站. ...

  7. HTML5+CSS3网站设计教程 (张晓景,胡克) [iso]

    <HTML5+CSS3网站设计教程>系统地讲解了CSS的基础理论和实际运用技术,并结合多个案例讲解了采用CSS与层布局相结合制作网页的方法,在详细讲解各个案例的制作中,不仅介绍了CSS样式 ...

  8. 让低版本IE也能正常运行HTML5+CSS3网站的3种解决方案

    现在我们可以选择浏览器非常多,所以浏览器的环境也是种类繁多,同一个浏览器也是包含各种不同的版本,不同的版本之间的渲染方法也存在差异,,它们支持的 HTML5.CSS3 特性恐怕也不尽相同.这种情况于是 ...

  9. 响应式HTML5+CSS3 网站开发测试实践

    仅仅利用media query适配样式是远远不够的,并没有考虑触屏下的行为和特有的内容组织方式的不同.简单在桌面版基础上叠加mobile版的代码,会带来请求增多.流量.性能.代码冗余等诸多方面问题.有 ...

随机推荐

  1. LINUX内核分析第五周学习总结——扒开应用系统的三层皮（下）

    LINUX内核分析第五周学习总结——扒开应用系统的三层皮(下) 张忻(原创作品转载请注明出处) <Linux内核分析>MOOC课程http://mooc.study.163.com/cou ...

  2. c# 导出数据到excel

    直接上代码: private void button1_MouseDown(object sender, MouseEventArgs e) { if (e.Button == MouseButton ...

  3. 第一次spring，第三天。

    陈志棚:界面跳转与框架 李天麟:游戏界面ui 徐侃:算法代码的设计 由于队员要回家,我们讨论后,在校的队员先完成自己的任务,待回来的队员完成后在开会讨论,我们的最终结果.

  4. Access restriction: The type 'BASE64Decoder' is not API

    Access restriction: The type 'BASE64Decoder' is not API (restriction on required library 'C:\Program ...

  5. 微信 小程序组件 加入购物车全套 one wxss

    //1,wxss /*外部容器*/ .container { display: flex; flex-direction: column; align-items: center; justify-c ...

  6. 【版本管理】自定义git

    Git除了可配置user.name和user.email外,实际上,Git还有很多可配置项. 如 $ git config --global color.ui true,让Git显⽰示颜⾊色,会让命令 ...

  7. Vue项目部署问题及解决方案

    Vue项目部署问题及解决方案 Vue-Router 有两种模式,默认是 hash 模式,另外一种是 history 模式. hash:也就是地址栏里的 # 符号.比如 http://www.examp ...

  8. anaconda的spyder打不开

    因为最近一段时间没有用Spyder,今天使用时,发现Spyder又又打不开了. 之前遇到Spyder打不开的情况时,是根据这里的教程:删除.matplotlib和.spyder两个文件,但这次删除这两 ...

  9. Reachability from the Capital CodeForces - 999E(强连通分量 缩点 入度为0的点)

    题意: 问至少加几条边 能使点s可以到达所有的点 解析: 无向图的连通分量意义就是  在这个连通分量里 没两个点之间至少有一条可以相互到达的路径 所以 我们符合这种关系的点放在一起, 由s向这些点的任 ...

  10. 【BZOJ1898】[ZJOI2005]沼泽鳄鱼（矩阵快速幂，动态规划）

    [BZOJ1898][ZJOI2005]沼泽鳄鱼(矩阵快速幂,动态规划) 题面 BZOJ 洛谷 题解 先吐槽,说好了的鳄鱼呢,题面里面全是食人鱼 看到数据范围一眼想到矩乘. 先不考虑食人鱼的问题,直接 ...