Categorías de contenido

La mayoría de los elementos HTML son miembros de una o más categorías de contenido — estas categorías agrupan elementos que comparten características comunes. Se trata de una agrupación flexible (en realidad no crea una relación entre los elementos de estas categorías), pero ayudan a definir y describir el comportamiento compartido de las categorías y las reglas asociadas a ellas. Es posible que algunos elementos no sean miembros de ninguna de estas categorías.

Las categorías de contenido se usan para definir el modelo de contenido de los elementos; es decir, qué puede tener cada uno como descendientes. Por ejemplo, el elemento <p> solo puede contener contenido de frase, mientras que el elemento <div> puede contener contenido de flujo. Algunos elementos, como <ins>, tienen un modelo de contenido transparente.

Existen siete categorías de contenido principales, que se pueden resumir en el siguiente diagrama de Venn:

Un diagrama de Venn que muestra cómo se interrelacionan las distintas categorías de contenido. Las siguientes secciones explican estas relaciones en el texto.

Nota: Un análisis más detallado de estas categorías de contenido y sus funcionalidades comparativas está fuera del alcance de este artículo; para eso, quizá quieras leer las partes relevantes de la especificación HTML.

Contenido de metadatos

Los elementos que pertenecen a la categoría de contenido de metadatos modifican la presentación o el comportamiento del resto del documento, establecen enlaces hacia otros documentos o transmiten otro tipo de información fuera de banda. Todo lo que está dentro de <head>, incluidos <title>, <link>, <script>, <style> y el menos usado <base>, es contenido de metadatos. Existe también el elemento <meta> para los metadatos que no se pueden representar con estos otros elementos.

Los elementos de metadatos son:

Algunos de estos elementos pertenecen a más de una categoría de contenido. Por ejemplo, <script> es miembro de las categorías de contenido de metadatos, de flujo y de frase, y además es un elemento de soporte de scripts; <script> se puede usar en cualquier lugar donde se espere contenido de metadatos, contenido de frase o elementos de soporte de scripts.

Contenido de flujo

El contenido de flujo es una categoría amplia que engloba la mayoría de los elementos que pueden ir dentro del elemento <body>, incluidos los elementos de encabezado, los elementos de seccionamiento, los elementos de frase, los elementos incrustados, los elementos interactivos y los elementos relacionados con formularios. También incluye nodos de texto (pero no aquellos que solo consisten en espacios en blanco).

Los elementos de flujo son:

Algunos otros elementos pertenecen a esta categoría, pero solo si se cumple una condición específica:

<area>, si es descendiente de un elemento <map>
<link>, si está presente el atributo itemprop
<meta>, si está presente el atributo itemprop

Contenido de seccionamiento

El contenido de seccionamiento, un subconjunto del contenido de flujo, crea una sección en el esquema actual que define el alcance de los elementos <header> y <footer>.

Los elementos de seccionamiento son:

Contenido de encabezado

El contenido de encabezado, un subconjunto del contenido de flujo, define el título de una sección. Esta definición se aplica tanto a las secciones marcadas explícitamente por elementos de contenido de seccionamiento como a las que se definen implícitamente mediante el propio contenido de encabezado.

Los elementos de encabezado son:

Nota: Aunque es probable que contenga contenido de encabezado, <header> no es, en sí mismo, contenido de encabezado.

Contenido de frase

El contenido de frase, un subconjunto del contenido de flujo, se refiere al texto y al marcado dentro de un documento. Las secuencias de contenido de frase forman párrafos.

Los elementos de frase son:

Algunos otros elementos pertenecen a esta categoría, pero solo si se cumple una condición específica:

<a>, si su contenido es solo de frase
<area>, si es descendiente de un elemento <map>
<del>, si su contenido es solo de frase
<ins>, si su contenido es solo de frase
<link>, si está presente el atributo itemprop
<map>, si su contenido es solo de frase
<meta>, si está presente el atributo itemprop

Contenido incrustado

El contenido incrustado, un subconjunto del contenido de flujo, importa otro recurso o inserta contenido de otro lenguaje de marcado o namespace en el documento.

Los elementos de contenido incrustado son:

Contenido interactivo

El contenido interactivo, un subconjunto del contenido de flujo, incluye elementos diseñados específicamente para la interacción del usuario.

Los elementos de contenido interactivo son:

Algunos elementos pertenecen a esta categoría solo bajo condiciones específicas:

<a>, si está presente el atributo href
<audio>, si está presente el atributo controls
<img>, si está presente el atributo usemap
<input>, si el atributo type no está en el estado oculto
<object>, si está presente el atributo usemap
<video>, si está presente el atributo controls

Contenido palpable

El contenido palpable es contenido que no está vacío ni oculto; es contenido que se renderiza y que es sustantivo. El contenido palpable no se usa para definir modelos de contenido, sino para establecer una regla general: los elementos cuyo modelo de contenido permite cualquier contenido de flujo o contenido de frase deben tener, al menos, un nodo en su contenido que sea contenido palpable y que no tenga especificado el atributo hidden.

Los elementos palpables son:

<a>
<abbr>
<address>
<article>
<aside>
<b>
<bdi>
<bdo>
<blockquote>
<button>
<canvas>
<cite>
<code>
<data>
<del>
<details>
<dfn>
<div>
<em>
<embed>
<fieldset>
<footer>
<figure>
<form>
<iframe>
<img>
<ins>
<kbd>
<label>
<main>
<map>
<mark>
<math>
<meter>
<nav>
<object>
<p>
<picture>
<pre>
<progress>
<q>
<ruby>
<s>
<samp>
<search>
<section>
<select>
<small>
<span>
<strong>
<sub>
<sup>
<svg>
<table>
<textarea>
<time>
<u>
<var>
<video>
Elementos personalizados autónomos
Texto sin formato que no sean espacios en blanco entre elementos

Algunos elementos pertenecen a esta categoría solo bajo condiciones específicas:

<audio>, si está presente el atributo controls
<dl>, si sus elementos hijos incluyen al menos un grupo nombre-valor
<input>, si el atributo type no está en el estado oculto
<ol>, si sus elementos hijos incluyen al menos un elemento <li>
<ul>, si sus elementos hijos incluyen al menos un elemento <li>

Elementos sin categoría

Varios elementos no son miembros de ninguna categoría de contenido. Entre ellos:

Elementos de soporte de scripts

Los elementos de soporte de scripts son elementos que no contribuyen directamente a la salida renderizada del documento. En cambio, sirven para dar soporte a los scripts, ya sea conteniendo o especificando directamente el código del script, o especificando datos que los scripts utilizarán. Casi todos los elementos, incluidos aquellos que solo aceptan elementos específicos (como <ul>, que acepta elementos <li>), pueden contener elementos de soporte de scripts.

Los elementos de soporte de scripts son:

Contenido asociado a formularios

El contenido asociado a formularios es un subconjunto del contenido de flujo compuesto por elementos que tienen un formulario propietario y pueden usarse en cualquier lugar donde se espere contenido de flujo. Un formulario propietario es el elemento <form> que lo contiene, o el <form> cuyo id se especifica en el atributo form del elemento.

Los elementos asociados a formularios son:

Esta categoría contiene varias subcategorías:

enumerado: Elementos que aparecen en las colecciones HTMLFormElement.elements y HTMLFieldSetElement.elements. Incluye <button>, <fieldset>, <input>, <object>, <output>, <select> y <textarea>.
enviables: Elementos que se pueden usar para construir el conjunto de datos del formulario cuando este se envía. Incluye <button>, <input>, <select> y <textarea>.
reiniciables: Elementos que pueden verse afectados cuando se reinicia un formulario. Incluye <input>, <output>, <select> y <textarea>.
que heredan autocapitalize y autocorrect: Elementos que heredan los atributos autocapitalize y autocorrect de su formulario propietario. Incluye <button>, <fieldset>, <input>, <output>, <select> y <textarea>.
etiquetables: Elementos que se pueden asociar con elementos <label>. Incluye <button>, <input> (todos los tipos salvo hidden), <meter>, <output>, <progress>, <select> y <textarea>.

Modelo de contenido transparente

Además de las categorías de contenido enumeradas, el modelo de contenido de un elemento también se puede definir como "transparente". Si el contenido permitido del elemento X es "transparente", entonces se consulta al padre de X. Se intersecciona el contenido permitido del padre de X con las categorías de contenido de X, y el resultado es lo que significa "transparente" en este contexto. Si el padre de X también tiene un modelo de contenido transparente, continuamos subiendo por el árbol hasta encontrar un modelo de contenido que no sea transparente. Cuando no existe tal padre, "transparente" significa "contenido de flujo".

Por ejemplo, el elemento <ruby> acepta contenido de frase. El elemento <ins> pertenece a la categoría de contenido de frase cuando solo contiene contenido de frase. Por lo tanto, un elemento <ins> se puede colocar dentro de un elemento <ruby>. El contenido permitido del elemento <ins> es "transparente", lo que, al estar anidado en <ruby>, significa "contenido de frase". Sin embargo, los elementos <rt> no son contenido de frase. Por lo tanto, un elemento <rt> no se puede anidar dentro de este elemento <ins>, aunque tanto <rt> como <ins> puedan estar dentro de <ruby>, y <ins> sea "transparente".

html

<ruby>
  Texto antes
  <ins>
    <!-- No válido: rt no puede colocarse dentro de ins aquí -->
    <rt>Pronunciación</rt>
  </ins>
</ruby>

html

<ruby>
  Texto antes
  <!-- Válido: ins puede estar dentro de ruby, y rt puede estar dentro de ruby -->
  <ins>Texto insertado</ins>
  <rt>Pronunciación</rt>
</ruby>

html

<ruby>
  Texto antes
  <!-- Válido: rt puede estar dentro de ruby, y ins puede estar dentro de rt -->
  <rt><ins>Pronunciación</ins></rt>
</ruby>

Transparente es un modelo de contenido, no una categoría de contenido, así que solo define lo que un elemento puede contener, no dónde se puede colocar el elemento. Es decir, al determinar la validez de los elementos hijos de un elemento, no puedes "ver a través" de los hijos transparentes. Por ejemplo, un elemento <ul> solo acepta elementos <li> y elementos de soporte de scripts, y no permite <del> ni <ins>, aunque el <del> solo contenga elementos <li>.

html

<ul>
  <del>
    <li>Naranjas</li>
    <li>Papel higiénico</li>
  </del>
  <li>Pasta de dientes</li>
</ul>

html

<ul>
  <li><del>Naranjas</del></li>
  <li><del>Papel higiénico</del></li>
  <li>Pasta de dientes</li>
</ul>

Help improve MDN

Learn how to contribute

This page was last modified on 9 sept 2026 by MDN contributors.

View this page on GitHub • Report a problem with this content