Article introduction of Wulin.com (www.vevb.com): How to let browsers below ie9 know your html5 tag name.
Because our website does not need to be compatible with ie6 and 7, I used the footer tag on the website. It turned out that ie9 supports this tag, but found that ie8 does not support this tag. The code:
<!doctype html>
<html>
<head>
<style type=text/css>
footer{
display:block;
}
</style>
<script type=text/javascript>
document.createElement(footer);
</script>
</head>
<body>
<footer>
<p>
I'm a paragraph
</p>
</footer>
</body>
</html>
Put it in ie8 and browse below. You can find that in ie8, the footer part of the code ie8 will automatically close when it encounters this tag. This is the code for footer in ie8.
<footer />
<p>
I'm a paragraph
</p>
<footer />
This will cause you to not recognize these tags in ie8, and of course you will not recognize ie6 and 7, and the layout in these browsers will be messy.
So I wrote the following css code.
footer{display:block;}
I thought to myself, I'm going to have this label for ie8 now.
As a result, ie8 still does not support it.
I found it online. It turns out that just writing css like this is not enough. While setting display:block for the tag, you also have to use js to create this element in the document. Now the code is as follows. IE8 already knows this tag, but if you don’t encounter this tag, it will be automatically closed.
<!doctype html>
<html>
<head>
<style type=text/css>
footer{
display:block;
}
</style>
<script type=text/javascript>
document.createElement(footer);
</script>
</head>
<body>
<footer>
<p>
I'm a paragraph
</p>
</footer>
</body>
</html>
Haha, now you can use the html5 tag on the page with confidence.