Elemento article en HTML

Elemento article en html

Un elemento article es parte de un documento, página, aplicación o sitio que está destinado a poder ser redistribuido y utilizado de forma independiente, como un tema de foro, artículo de periódico o publicación de blog.

Un ejemplo del uso de elementos <article> para representar el contenido de la publicación y los comentarios. Este ejemplo muestra cómo se usa el elemento <article> con otros elementos HTML:

< article > 
  < h1 > Bigcode HTML </ h1 > 
  < p > Tiene como objetivo proporcionar una documentación completa y de alta calidad, respaldada por ejemplos de cada caso en particular. </ p > 
</ article >

Elemento article

Clasificaciones de contenidoElemento organizativo.
Contenido permitidoContenido organizacional.
AcrónimoLas etiquetas de inicio o finalización no se pueden omitir.
Elementos del padreCualquier elemento que acepte contenido normativo.Tenga en cuenta que el elemento <article>no puede ser hijo del elemento <address>.
Interfaz DOMOHTMLElement

Soporte de navegadores

ChromeFirefoxEdgeSafariÓpera
54.0Soportado4.111.10

Características

En este elemento se pueden utilizar propiedades globales.

Notas de uso

  • Cada elemento debe ser <article> identificado, generalmente incluyendo el encabezado <h1>‏-<h6> dentro del elemento <article>.
  • Cuando se usa más de un elemento <article> entre sí, el elemento interno representa un artículo relacionado con el elemento principal, por ejemplo, los comentarios en una publicación están contenidos dentro de elementos <article> y dentro de un elemento <article> que representa la publicación en sí.
  • La información del autor dentro de un <article> elemento se puede proporcionar por elemento <address>, pero esta información no se aplicará a los elementos <article> anidados dentro del elemento padre.
  • La fecha y hora de publicación de un elemento se pueden describir <article> mediante datetime la propiedad secundaria del elemento <time>.

Ejemplos de uso

Ejemplo ampliado que muestra cómo se usa el elemento <article> dentro y dentro de varios subprocesos, como <section>(que a su vez contiene <article> otros elementos ), y cómo describir el tiempo de publicación usando el elemento <time>(que puede estar contenido en un pie de página <footer>):

< article > 
  < h1 > Manzanas </ h1 > 
  < section > 
    < h2 > variedades de Manzanas </ h2 > 
    < p > Párrafo o párrafos que explican los diferentes tipos de Manzanas </ p > 
  </ section> 
  < section > 
    < article > 
      < h2 > Comentario del profesor de botánica </ h2 > 
      < p > Párrafo que aclara la opinión del profesor </ p >
      < footer > 
        < p >
          Publicado en
          < time  datetime = "2021-04-18 11:00" > 18 de abril </ time > 
        </ p > 
      </ footer >  
     </ article >
    < article  class = "user_review" > 
      < h2 > Nuestra opinión sobre el comentario del profesor < / h2 > 
      < p > Un párrafo que explica nuestra opinión sobre lo que dijo el profesor </ p > 
      < time  datetime = "2021-05-17 10:00" > </ time > 

Formato predeterminado

La mayoría de los navegadores muestran el elemento <article> con la propiedad establecida display en block:

article {
  display: block;
}