You can get some older browsers (which don’t support HTML5) to support HTML5. Modern browsers support HTML5. In addition, all browsers, both old and up-to-date, automatically treat unrecognized elements as inline elements. Because of this, you can “teach” browsers to deal with “unknown” HTML elements. You can even teach IE6 (Windows XP 2001) browsers to handle unknown HTML elements. HTML5 defines eight new HTML semantic elements. All these elements are block-level elements. In order for older browsers to display these elements correctly, you can set the CSS’s You can do it for The instance directs to JavaScript statement You can use the above methods to add for IE browsers Browsers of Internet Explorer 8 and earlier IE versions do not support the above methods. We can use “HTML5 Enabling JavaScript”, “shiv” created by Sjoerd Visscher to solve this problem: The above code is a comment that reads when the version of the IE browser is less than IE9 Note: domestic users please use the static resource library of this site (Google resource library is unstable in China): For IE browsers 11.31.1. HTML5 browser support ¶
11.31.2. Define a HTML5 element as a block element ¶
display
property value is
block
:Example ¶
header,section,footer,aside,nav,main,article,figure{display:block;}
11.31.3. Add a new element to HTML ¶
HTML
add a new element.
HTML
add a new element and define a style for the element, named
<myHero>
:Example ¶
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Add new elements to HTML</title>
<script>
document.createElement("myHero")
</script>
<style>
myHero {
display: block;
background-color: #ddd;
padding: 50px;
font-size: 30px;
}
</style>
</head>
<body>
<h1>My first title</h1>
<p>My first paragraph.</p>
<myHero>My first new element</myHero>
</body>
</html>
document.createElement("myHero")
is to add a new element to the IE browser. 11.31.4. Internet Explorer browser issu ¶
HTML5
element, but:<!--[if lt IE 9]>
<script
src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
html5.js
file and parse it.<!--[if lt IE 9]>
<script
src="http://cdn.static.runoob.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->
html5shiv
is a better solution.
html5shiv
the main problem is that the new elements proposed by HTML5 are not recognized by IE6-8, these new elements can not be used as parent nodes to wrap child elements, and the CSS style can not be applied. 11.31.5. Perfect Shiv solution ¶
Example ¶
<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>Rendering
HTML5</title><!--[if lt IE 9]> <script
src="http://cdn.static.runoob.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]--></head><body><h1>My First Article</h1><article>Rookie Tutorial ——
Learning is not only about technology, but also about dreams!!!</article></body></html>
html5shiv.js
the reference code must be placed in the
<head>
element, because the IE browser needs to load the file before parsing the new HTML5 element.