todas sirven semánticas semanticas semantica qué que programacion para las etiquetas estructura elementos ejemplos ejemplo atributos html5 cross-browser

html5 - sirven - todas las etiquetas de html y sus atributos



Problemas de degradación para etiquetas semánticas HTML5(artículo, pie de página, encabezado) (3)

¿Qué tan bien se degradan las nuevas etiquetas de diseño en HTML5? ¿Cuáles son los peligros al usarlos? (No estoy hablando de <video> He visto un código de respaldo específico para ello).

Concretamente, en el caso de algo como

<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>

¿El uso de <header> , <article> o <footer> causaría problemas con el navegador? ¿Se degradan a <div> en los navegadores no compatibles automáticamente? O, si los incluyo, ¿debería incluirlos solo por significado semántico, y no por estilos CSS o scripts DOM?


Las etiquetas HTML 5 no son compatibles con IE, las etiquetas aún están inactivas. Para activar las etiquetas semánticas de HTML5 en IE, use el siguiente script dentro de su sección principal.

<!--[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]-->


Para la presentación, usarás CSS de todos modos, así que realmente no importa si el navegador entiende la etiqueta en sí.


Siempre que use html5shiv para manejar IE, funcionará bien.

El navegador tratará todas las etiquetas desconocidas (incluidas las etiquetas HTML5) como elementos en línea normales.
Debe incluir la siguiente regla de CSS:

article, aside, figure, footer, header, hgroup, menu, nav, section { display: block; }