Degradation issues for HTML5 semantic tags (article, footer, header)
Question
How well do the new layout tags in HTML5 degrade? What are the hazards in using them? (I'm not talking about <video> --I've seen specific fallback code for it).
Specifically, in the case of something like
<html>
<head></head>
<body>
<header>
<h1>Talking Dogs</h1>
<b><p>Humans aren't the only talkers!</p></b>
</header>
<article>
<p>Ever encountered a talking dog? I have.</p>
<p>It all happened one day as I was walking down the street...</p>
</article>
<footer>
© 2009 Woofer Dog Corporation
</footer>
</body>
</html>
Would using <header> , <article> , or <footer> cause any browser problems? Do they degrade to <div> in unsupporting browsers automatically? Or if I include them, should I only include them for semantic meaning, and not for CSS styling or DOM scripting?
3 answers
solution1
33 ACCPTED 2010-06-03 15:22:15
As long as you use html5shiv to handle IE, it will work fine.
The browser will treat all unknown tags (including HTML5 tags) as normal inline elements.
You should include the following CSS rule:
article, aside, figure, footer, header, hgroup,
menu, nav, section { display: block; }
solution2
1 2010-06-03 15:22:40
对于演示文稿，无论如何你都会使用CSS，所以如果浏览器理解标签本身并不重要。
solution3
0 2012-08-30 13:49:40
HTML 5 Tags are not supported in IE the tags are still inactive. To activate the semantic HTML5 tags in IE use the following script inside your head section.
<!--[if IE]>
<script type="text/javascript">
(function(){
var html5elmeents = "address|article|aside|audio|canvas|command|datalist|details|dialog|figure|figcaption|footer|header|hgroup|keygen|mark|meter|menu|nav|progress|ruby|section|time|video".split('|');
for(var i = 0; i < html5elmeents.length; i++){
document.createElement(html5elmeents[i]);
}
}
)();
</script>
<![endif]-->
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.