HTML5对浏览器的支持以及创建自己的元素

Html5对浏览器的支持:

对IE9的支持,要在页面head中添加如下代码
<!--[if lt IE 9]>
<script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->

让IE(包括IE6)支持HTML5元素,我们需要在HTML头部添加以下JavaScript,这是一个简单的document.createElement声明,利用条件注释针对IE在对象中创建对应的节点。


<!--[if IE]>
<script>
document.createElement("header");
document.createElement("footer");
document.createElement("nav");
document.createElement("article");
document.createElement("section");
</script>
<![endif]-->

HTML5在默认情况下表现为内联元素,对这些元素进行布局我们需要利用CSS手工把它们转为块状元素,如下例:


header, footer, nav, section, article {
display:block;
}

创建自己的元素
使用document.createElement("")来创建

<!DOCTYPE html>
<!--
	时间:2016-09-16
	描述:使用document.createElement("");创建新的元素
	      在head使用<style>来定义元素的style
-->
<html>

	<head>
		<meta charset="utf-8" />
		<title>我喜欢你呀WEB</title>
		<script>
			document.createElement("me");
		</script>
		<style type="text/css">
			me{
				display: block;
				background: #aa11f0;
				padding: 5px;
				font-size: 20px;
				width: 130px;
				color:blue;
			}
		</style>
<!--[if lt IE 9]>
<script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->
	</head>

	<body>
		<me>
			this is me
	
		</me>
	</body>
	

</html>


猜你喜欢

转载自blog.csdn.net/Lxiaohuli/article/details/52554565
今日推荐