ie8以下不兼容h5新标签的解决方法
HTML5新添了一些语义化标签,他们能让代码语义化更直观易懂,有利于SEO优化。但是此HTML5新标签在IE6/IE7/IE8上并不能识别,需要进行JavaScript处理。
解决思路就是用js创建html5中的新标签,代码如下:
<script>
(function() {
if (!
/*@cc_on!@*/
0) return;
var e = "abbr, article, aside, audio, canvas, datalist, details, dialog, eventsource, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, time, video".split(', ');
var i= e.length;
while (i--){
document.createElement(e[i])
}
})()
</script>
对于上面的代码要初始化新标签的CSS.因为HTML5在默认情况下表现为内联元素,对这些元素进行布局我们需要利用CSS手工把它们转为块状元素方便布局。
另外对于代码中if (! /*@cc_on!@*/ 0) return;是什么意思大多数人会有困惑,主要是用于判断浏览器是否支持注释条件编译。在Internet Explorer 11标准模式和Windows应用商店应用中不支持条件编译。 在Internet Explorer 10标准模式和所有早期版本中支持条件编译。这样非IE浏览器就会忽视这段代码,也就不会有无谓的http请求了。
ie8以下不兼容h5新标签的解决方法的更多相关文章
- 让ie浏览器支持html5新标签的解决方法(使用html5shiv)
没估计错的话旧版浏览器都是不识别这些新增的标签所以都是用行内元素来处理解决的,所以,有一个解决办法的突破口就是让它变成块状元素就不会处于同一行了,这样在新旧浏览器都是可以显示同样的效果,再者就是让浏览 ...
- 解决IE7兼容H5新标签的方法
外部引入JS <script src="http://cdn.bootcss.com/html5shiv/r29/html5.min.js"></script&g ...
- H5新标签(适合新手入门)
H5新标签 文档类型设定 document HTML: sublime 输入 html:4s XHTML: sublime 输入 html:xt HTML5 sublime 输入 html:5 < ...
- H5新标签
1. H5新标签 语义标签: <article>定义文章</article><aside>定义文章侧边栏</aside> <figure>定 ...
- 完美解决ie8以下不兼容h5的方法
HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页面显得非常简单. HTML5的新标签元素有: <header&g ...
- 处理H5新标签方法
语义化 HTML5中加入了更加具有语义化的标签,比如header,nav,footer等,可以为搜索引擎优化,让爬虫能更好地理解网页结构. 但是对于新标签的兼容性不是很好,IE9以下旧版本不支持新的语 ...
- 前端基础小标签3 H5新标签
第二部分H5的新标签一.<!-- mark标签 1.用于显示页面中需要重点关注的内容,就像看书需要用荧光笔划重点一样 2.浏览器通常会用黄色显示m ...
- h5新增加的存储方法
h4中使用的cookie把用户信息保存在客户端浏览器,但是它受到很多限制. 大小:最多能存储4k 带宽:它是随着http请求一起发送到服务器的,因此浪费一部分的带宽. 复杂度:操作复杂. h5新增加了 ...
- CSS兼容IE Firefox问题与解决方法
一.双边距问题浮动元素的外边距会加倍,但与第一个浮动元素相邻的其他浮动元素外边距不会加倍.解决方法:在此浮动元素增加样式 display:inline; 二.图片产生的间隙父元素直接包含<im ...
随机推荐
- Dubbo入门到精通学习笔记(十五):Redis集群的安装(Redis3+CentOS)、Redis集群的高可用测试(含Jedis客户端的使用)、Redis集群的扩展测试
文章目录 Redis集群的安装(Redis3+CentOS) 参考文档 Redis 集群介绍.特性.规范等(可看提供的参考文档+视频解说) Redis 集群的安装(Redis3.0.3 + CentO ...
- Codeforces 1189B Number Circle
题目链接:http://codeforces.com/problemset/problem/1189/B AC代码: #include<bits/stdc++.h> using names ...
- webstorm vue eslint 自动修正配置
原文:https://medium.com/@netczuk/even-faster-code-formatting-using-eslint-22b80d061461 https://stackov ...
- js文本框焦点自动聚焦到下个文本框
HTML: <form> <input type="text" name="text1" maxlength="3" si ...
- 一、微服务概述与SpringCloud
一.微服务概述与SpringCloud 1.微服务与微服务架构 微服务强调的是服务的大小,它关注的是某一个点,是具体解决某一个问题/提供落地对应服务的一个服务应用,狭意的看,可以看作Eclipse里面 ...
- POJ 3259 Wormholes Bellman题解
版权声明:本文作者靖心,靖空间地址:http://blog.csdn.net/kenden23/.未经本作者同意不得转载. https://blog.csdn.net/kenden23/article ...
- webpack 配置之入门二(css 篇)
在项目中我们通过 css 来美化页面,css 也成为了网站不可或缺的一部分,这章节主要介绍 webpack 处理 css 部分, 1.webpack 处理 css 在 webpack 中,我们通过 s ...
- 使用JMeter进行http压力测试
一.背景及文档目的说明 采用JMeter测试工具对腾讯视频做负载测试,使用 JMeter图形结果和聚合图帮助测试系统在资源超负荷情况下的表现,以发现设计上的错误或验证系统的负载能力并估计系统瓶颈和并发 ...
- python 编写暴力破解mysql用户名密码
本文摘自别人的,自己运行调试了一下#!/user/bin/env python#-*- coding:utf-8 -*- import pymysql#导入连接数据库的模块import sys cla ...
- 【开篇】基于C#+EmguCV的机器视觉平台开发
市面上关于通用的机器视觉平台已有不少,一些大的视觉产品.设备制造商都有开发自己的一套系统.其通用性也都有一些行业局限,难以囊括所有可能性,一些需要经过二次开发,这也是难以攻克的问题.本人水平有限,再加 ...