HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法

2024-06-24 11:14:16阅读量：75 字体：大 中 小

HTML5的语义化标签以及属性，可以让开发者非常方便地实现清晰的web页面布局，加上CSS3的效果渲染，快速建立丰富灵活的web页面显得非常简单。

HTML5的新标签元素有：


定义页面或区段的头部;



定义页面或区段的尾部;



定义页面或区段的导航区域;



页面的逻辑区域或内容组合;



定义正文或一篇完整的内容;



定义补充或相关内容;


HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法

使用他们能让代码语义化更直观,而且更方便SEO优化。但是此HTML5新标签在IE6/IE7/IE8上并不能识别，需要进行JavaScript处理。以下就介绍几种方式。

方式一：Coding JavaScript

如果是IE9以下的IE浏览器将创建HTML5标签， 这样非IE浏览器就会忽视这段代码，也就不会有无谓的http请求了。

第二种方法：使用Google的html5shiv包(推荐)

由于国内google的服务器访问卡，建议调用国内的cdn

但是不管使用以上哪种方法,都要初始化新标签的CSS.因为HTML5在默认情况下表现为内联元素，对这些元素进行布局我们需要利用CSS手工把它们转为块状元素方便布局

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

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

这样可以引导用户开启脚本,或者直接跳转到HTML4标签设计的界面。

免责声明：

本文《HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法》版权归原作者所有,内容不代表本站立场！

如本文内容影响到您的合法权益（含文章中内容、图片等），请及时联系本站，我们会及时删除处理。

推荐阅读

  • 手机淘宝首页布局怎么变了

    手机淘宝首页布局怎么变了

    手机淘宝首页布局变了可能是开启了长辈模式，开启长辈模式的布局就会改变，可以通过设置改回原来的布局，具体操作步骤如下： 手机淘宝首页布局怎么变了 1、打开淘宝app，点击我的淘宝，再点击右上角的齿轮进入...

    阅读: 817

  • 强制解除小红书实名认证

    强制解除小红书实名认证

    小红书账号一旦实名认证过了就不能解除实名认证了，只能通过注销账号的方式来解除实名认证。具体的操作方式如下： 强制解除小红书实名认证 1、打开小红书，点击进入我”的界面，再点击右上角的三条横...

    阅读: 792

  • 快手怎么买热门

    快手怎么买热门

    上了快手热门的视频可以推送给更多的用户，让视频得到更高的热度，在快手买热门的具体操作方式如下： 快手怎么买热门 1、打开快手，点击左上角的三条横线”，进入功能栏”界面。 2...

    阅读: 769

  • 微信闭关中是什么状态

    微信闭关中是什么状态

    微信闭关中是不与外界往来的状态。微信状态显示闭关，可能是因为最近比较忙，又或者是碰到烦心的事情，有一种自我封闭的含义。以下是设置微信状态的操作方法： 微信闭关中是什么状态 1、打开微信，点击我&rdq...

    阅读: 693

  • qq打开文件默认设置怎么改

    qq打开文件默认设置怎么改

    qq，为腾讯qq的简称，是一款基于互联网的即时通信软件。修改qq打开文件默认设置的具体操作如下： qq打开文件默认设置怎么改 1、点击手机设置”-应用与权限”-应用管理&rdq...

    阅读: 727

  • 微信注销后聊天记录还能恢复吗

    微信注销后聊天记录还能恢复吗

    如果对聊天记录进行备份或迁移的话，微信注销后聊天记录可以恢复。如果没有对聊天记录进行备份或迁移的话，微信注销后聊天记录无法恢复。以下是注销微信的操作步骤： 微信注销后聊天记录还能恢复吗 1、打开微信A...

    阅读: 759

热门文章

最近更新