El mejor tutorial de elementos semánticos HTML5 en 2024. En este tutorial podrás aprender Lo que es elementos semánticos?,Soporte para el navegador,HTML5 nuevos elementos semánticos,elemento <section> HTML5,Ejemplos,elemento <article> HTML5,Ejemplos,HTML5 elemento <nav>,Ejemplos,elemento <aside> HTML5,Ejemplos,elemento <header> HTML5,Ejemplos,HTML5 elemento <pie de página>,Ejemplos,HTML5 <figure> y <figcaption> elemento,Ejemplos,Podemos empezar a utilizar estos elementos semánticos hacen?,Internet Explorer 8 y versiones anteriores de los problemas de IE,
Semántica = significado.
elementos semánticos = elemento de detección.
A los elementos semánticos pueden describir claramente su importancia para el navegador y desarrolladores.
Ejemplos de elementos no-semánticos: <div> y <span> - independientemente de su contenido.
Ejemplos de elementos semánticos: <form>, <table> y <img> - define claramente su contenido.
Internet Explorer 9 o superior, Firefox, Chrome, Safari y Opera soporta elementos semánticos.
Nota: Internet Explorer 8 y versiones anteriores no son compatibles con este elemento, pero la parte inferior del artículo ofrece una solución compatible.
Muchos sitios web existentes incluyen el código HTML siguiente: <div id = "nav">, <div class = "header"> o <div id = "pie">, para indicar enlaces de navegación, la cabeza y la cola.
HTML5 ofrece una nueva elementos semánticos para definir una parte diferente de la página Web:
<Sección> define la sección del documento (sección, la sección). Tales como capítulos, encabezados, pies u otras partes del documento.
De acuerdo con el documento del W3C HTML 5: sección contiene un conjunto de contenidos y su título.
<Artículo> define el contenido independiente. .
<Article> elemento Ejemplo:
<Nav> para definir la sección de enlaces de navegación.
<Nav> se utiliza para definir la navegación página enlaza algunas zonas, pero no todos los enlaces deben ser incluidos en el elemento <nav>!
<Aparte> define el contenido de la página más allá del área principal de contenido (como la barra lateral).
Contenido a un lado la etiqueta debe estar asociada con el área de contenido principal.
<Header> describe el área de la cabeza del documento
<Header> elemento nota se describe el área de visualización se utiliza para definir el contenido.
En la página se puede utilizar el elemento <header> múltiple.
El ejemplo siguiente define la cabecera del artículo:
<Pie de página> describe la zona inferior del documento.
<Pie de página> elemento debe contener los elementos que contiene
Un pie de página contiene normalmente el autor del documento, la información de derechos de autor, los vínculos condiciones de uso, información de contacto, etc.
Documento puede utilizar con múltiples elementos <pie de página>.
<Figura> etiqueta especificada contenido de corriente separada (imágenes, gráficos, fotografías, código, etc.).
Contenido <figure> elemento debe estar asociado con el contenido principal, pero si se elimina, no responden al impacto de flujo de documentos.
<Figcaption> define el elemento <figure> título.
<Figcaption> elemento debe ser colocado en el elemento "figura" de la primera o la última posición de elemento hijo.
Los elementos anteriores son elementos de bloque (excepto <figcaption>).
Para estos bloques y elementos que tengan efecto en todas las versiones del navegador, es necesario establecer en los atributos de archivo de hoja de estilo (en lo sucesivo, código de estilo permite a los navegadores antiguos soportan elementos de bloque en este capítulo):
IE8 y versiones anteriores de IE no se pueden representar en estos elementos, efectos CSS, por lo que no pueden utilizar <header>, <section>, <pie de página>, <aside>, <nav>, <artículo>, <figure>, u otro los elementos de HTML5.
Solución: Puede utilizar la secuencia de comandos HTML 5 Shiv Javascript para resolver los problemas de compatibilidad de IE. HTML5 Shiv Descargar: http://code.google.com/p/html5shiv/
Una vez descargado, el código siguiente en la página:
El código de seguridad cuando la versión del navegador IE9 menos de cargar html5shiv.js archivo, debe colocarlo en el elemento <head>, ya que se requiere el navegador Internet Explorer después de cargar la cabeza la prestación de estos nuevos elementos HTML5