HTML5语义化标签兼容IE6~8

转载 2017年01月03日 09:19:00

HTML5一些语义化的标签: 
这些语义化的标签在IE8版本之前(非标准浏览器)不支持,其他标准浏览器支持。除其他标签都是成对存在的。

<header> 标签定义文档的页眉(介绍信息)。
<hgroup> 页面上的一个标题组合。
<footer> 页面的底部或者版块底部。
<article> 用来在页面中表示一套结构完整且独立的内容部分。
<section> 页面上的版块,用于划分页面上的不同区域,或者划分文章里不同的节
<nav> 导航 (包含链接的的一个列表)
<aside> 元素标签可以包含与当前页面或主要内容相关的引用、侧边栏、广告、nav元素组,以及其他类似的有别与主要内容的部分。
<figure> 用于对元素进行组合。一般用于图片或视频
<figcaption>  figure的子元素 用于对figure的内容 进行说明
<time>用来表现时间或日期,有datetime属性。
以下标签具有一些功能:
<datalist>选项列表。与 input 元素配合使用,来定义 input 可能的值,要设定input中list属性为datalist 的id。
<details>用于描述文档或文档某个部分的细节,Open 属性默认展开(最好显示的表明open)
< summary> details 元素的标题
<dialog>定义一段对话
<address> 定义文章 或页面作者的详细联系信息
<mark> 需要标记的词或句子
<keygen>给表单添加一个公钥 <keygen name="security" />
<progress>定义进度条
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19

解决在非标准浏览器下不兼容的问题

一、针对IE6-8这些不支持Html5语义化标签的浏览器我们可以使用JavaScript来解决他们 方法如下: 
在页面的头部加下: 

document.createElement(“header”); 
document.createElement(“nav”); 
document.createElement(“footer”); 
…… 
HTML5语义化标签在IE6-8下,我们用js创建出来之后,他是不会有任何默认样式的甚至是 display,所以在样式表里 要对这些标签定义一下 它默认的display。

<!DOCTYPE HTML> 
<html> 
  <head> 
  <meta  charset=utf-8"> 
  <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(','),
    	    i = e.length;
    	while(i--){
    		document.createElement(e[i])}
    	})()
  </script> 
	<style> 
	article,aside,dialog,footer,header,section,footer,nav,figure,menu {display:block}
	
	body {
	    margin: 0;
	}

	header {
	    height: 100px;
	    background: #9F3;
	}

	article {
	    padding: 10px;
	    background: #CF6;
	    overflow: hidden;
	    zoom: 1;
	    position: relative;
	}

	aside {
	    width: 200px;
	    height: 300px;
	    background: #F06;
	    position: absolute;
	    left: 10px;
	    top: 10px;
	}

	section {
	    margin-left: 210px;
	    background: #F90;
	    height: 300px;
	}

	footer {
	    height: 100px;
	    background: #C6C;
	}
	</style> 
</head>
<body> 
    <header>页面头部</header> 
    <article> <aside>侧边栏</aside> 
    <section>内容区域</section> </article> 
    <footer>页面底部</footer> 
</body> 
</html>

二、可以引用一个js插件解决HTML5语义化标签在IE6-8不兼容问题。 

下载地址:http://www.bootcdn.cn/html5shiv/


转自:http://blog.csdn.net/wmaoshu/article/details/51981330

http://www.cnblogs.com/iglass/p/4438171.html

举报

相关文章推荐

关于HTML5标签不兼容(IE6~8)

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

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

HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页面显得非常简单。 HTML5的新标签元素有: 定义页面或区段的头...

我是如何成为一名python大咖的?

人生苦短,都说必须python,那么我分享下我是如何从小白成为Python资深开发者的吧。2014年我大学刚毕业..

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

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

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

原文连接:http://www.cnblogs.com/Capricornus/archive/2013/03/26/2982122.html HTML5的语义化标签以及属性,可以让开发者非常方...

HTML5新标签在IE6/IE7/IE8中的几种兼容方式

HTML5新标签在IE6/IE7/IE8中的几种兼容方式 coding javascript 代码块 (function(){ If(!0) Return;...
  • gzz168
  • gzz168
  • 2016-05-20 17:05
  • 2304

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

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

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

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

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

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

HTML5 rgba与opacity的属性 兼容ie6/7/8/9各浏览器

RGBa 与 opacity 效果的区别            .main{ background:#000; width:300px; height:300px; }   .main-1{ ...

HTML5 rgba与opacity的属性 兼容ie6/7/8/9各浏览器

在css3之前,在样式中指定的颜色值只能为RGB颜色值,并且只能通过opacity属性来设置元素的透明度。CSS3中增加了3种颜色值-RGBA颜色值,HSL颜色值及HSLA颜色值,并且允许通过对RGB...
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)