当前位置:  编程技术>WEB前端

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

    来源: 互联网  发布时间:2014-10-07

    本文导语:  如果开发时按最低标准,比如IE6不支持的特性,我们统统不用,那就没有必要写这篇文章了;但我想这种情况极少,更多的开发,是在现代浏览器上使用它们支持的特性,而在早期浏览器上做一定的降级处理,这就是所谓 “渐...

如果开发时按最低标准,比如IE6不支持的特性,我们统统不用,那就没有必要写这篇文章了;但我想这种情况极少,更多的开发,是在现代浏览器上使用它们支持的特性,而在早期浏览器上做一定的降级处理,这就是所谓 “渐进增强”,也是本文要说的重点。通过下面的方法,希望可以让网站也能够在低版本IE浏览器上奇迹般地运行得更好!
htmlshiv.js
Remy的 HTML5shiv通过JavaScript 来创建HTML5元素(如 main, header, footer等)。在某种程度上通过JavaScript 创建的元素是 styleable(可样式)的。我们可以花很多时间来思考其运行原理,但谁会在乎呢?这种策略在所有产品网站上仍然是必须使用的。

代码如下:
selectivizr.js
Selectivizr.js 是一个不可思议的资源,用于填充不支持的CSS选择器和属性,包括重要的 last-child。在最近的重设计中,我嵌入了 selectivizr,并在更老的 IE 浏览器上也不会错过任何细节。下面是我的实现代码:
代码如下:

现代项目绝对必须的。只在老版本IE时才加载。
另外,Modernizr 脚本中已经添加 HTML5 浏览器支持脚本 html5shiv,我们只要引用 Moernizr.js 文件,IE9 以下的 IE 浏览器就支持 HTML5 添加的语义标签如 nav、section、article 等,也可以使用 CSS 对它们进行样式化。
条件注释
下面这样最土的情况你肯定看到过。但无论丑陋与否,事实上这段代码完全按预期的方式运行:
代码如下:






上面的方法是作用于css,来写一些针对IE各版本的样式差异。先判断用户用的哪个IE版本,然后在标签上加上该版本的class,这样可以方便hack。

然后我们在css文件中就可以这样写:

代码如下:

.ie6 xxx {};
.ie7 xxx {};

这是目前小编认为效率最高的方法,这个方法不需要或等待JavaScript,而且也不需要重量级的JavaScript库。你定义的styles类立即生效,还没有闪屏。

尽管IE浏览器正在迎头赶上竞争对手,新版本IE也有非常大的变化,并希望借助全新的IE重塑网络体验。但在国内旧版IE仍然是比较流行。好消息是,这些资源在所有现代浏览器上运行良好,代价也并不高!


    
 
 

您可能感兴趣的文章:

  • 请问在高版本linux编译链接的程序如何在低版本Linux上运行
  • 为什么我在低版本的程序不能在高版本的LINUX上运行?
  • wine的最新版本是什么?能让LINUX运行哪些Win软件?
  • 发布出去的程序,运行时总依赖glibc的版本怎么办??
  • 谁实验过哪个版本的java虚拟机在xp平台上运行成功了?
  • HTML标签参考手册 iis7站长之家
  • 我装了winamp和realoneplayer for linux版本,怎么运行阿?
  • 做了一个程序,想在其他机子上运行,但是说GTK版本太低,请问怎么发布程序?
  • 在程序运行中,如何得到JVM的版本号?在线等待
  • 寻找 : LEM — 运行在 386 上的小型(<8 MB)多用户、网络 Linux 版本。
  • 如何在shell下查看当前运行的内核版本号?
  • redhat ent 4 u4上,如何象readhat ent3 u6版本那样使用top可以查看每个逻辑CPU的利用率以及运行进程的资源使用情况?
  • 有人知道如何用C程序查询当前运行机器的glibc版本么?
  • 请问linux下可以同时安装运行两个版本的oracle吗?
  • FC4,运行java命令时出现的错误,而且java -version时显示的版本不对?
  •  
    本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
    本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • sharepoint 2010中item.Update()和item.SystemUpdate 修改数据版本问题解决
  • 内核版本和程序便以版本的不匹配如何解决
  • 请问如何解决因为库的版本与文件系统不兼容引起的段错误?
  • Linux下PCI驱动,怎么解决不同版本内核都需要重新编译的问题??
  • php4.1.2版本更新问题,解决的给100分
  • 解决SqlServer 各版本 sa帐户不能登录问题
  • 基于Fedora14下自带jdk1.6版本 安装jdk1.7不识别的解决方法
  • sql2005以上版本解决syscolumn表中数据无法修改问题
  • jQuery获得IE版本不准确webbrowser的解决方法
  • php5.2以下版本无json_decode函数的解决方法
  • 使用python搭建Django应用程序步骤及版本冲突问题解决
  • 创建共享库文件(.so)版本冲突问题如何解决
  • 我今明两天要安装unix操作系统. 请问最容易安装的版本是哪一只(我记得我以前想安装, 遇到问题解决不了所,以到今还没有见过unix 的芳貌.
  • 解决IE7以下版本不支持无A状态伪类的几种方法
  • php calender(日历)二个版本代码示例(解决2038问题)
  • 附加到SQL2012的数据库就不能再附加到低于SQL2012的数据库版本的解决方法
  • 通过javascript实现DIV居中,兼容各浏览器版本
  • 请问LINUX内核版本为2.4.31的是什么版本?自己写的串口驱动,是否向下兼容,还是必需版本相同?
  • Apache hadoop当前各个版本说明
  • 请教:linux 的版本问题,上面想跑J2EE或网站之类的装什么版本?客户端或个人机装什么版本?
  • Hypertable 0.9.7.10 各种版本下载地址(最新版)
  • libxml2是针对aix、sco、linux分不同版本还是统一版本?
  • linux哪个版本好?linux操作系统版本详细介绍及选择方案推荐
  • 内核版本问题 GCC版本问题
  • resin及jetty介绍以及如何 查看他们的版本号
  • Linux不同版本内核目录下的ChangeLog是以哪个版本作为对比?
  • 不同版本MSSQL清除日志方法介绍
  • C# 获取程序集版本、文件版本
  • 准备学习docker: docker version命令查看版本
  • 什么版本的linux系统 内置 glibc2.4以上的版本
  • 软件项目版本控制需要注意的几点


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3