Referencia de Elementos HTML

Esta página lista todos los elementos HTML. Están agrupados por funciones para ayudarte a encontrar lo que tienes en mente con facilidad. Aunque esta guía está escrita para aquellos que son nuevos escribiendo código, se pretende que sea una referencia útil para cualquiera.

Nota: Para más información básica acerca de los elementos y atributos HTML, vea la sección sobre elementos en el artículo 'Introducción a HTML' (en-US).

Raíz principal

Element Description
<html> El elemento HTML <html> (o elemento HTML raiz) representa la raiz de un documento HTML. El resto de elementos descienden de este elemento.

Metadatos del documento

Los metadatos contienen información sobre la página. Esto incluye información sobre estilos, scripts y datos que ayudan al software (search engines (en-US), browsers, etc.) a usar y generar la página. Los metadatos de estilos y scripts pueden estar definidos en la página o estar enlazados a otro fichero que contiene la información.

Element Description
<base> El elemento HTML <base> especifica la dirección URL base que se utilizará para todas las direcciones URL relativas contenidas dentro de un documento. Sólo puede haber un elemento <base> en un documento.
<head> El elemento HTML <head> provee información general (metadatos) acerca del documento, incluyendo su título y enlaces a scripts y hojas de estilos.
<link> El elemento HTML <link> especifica la relación entre el documento actual y un recurso externo. Los usos posibles de este elemento incluyen la definición de un marco relacional para navegación. Este elemento es más frecuentemente usado para enlazar hojas de estilos.
<meta> Sus etiquetas son: <meta> (solo tiene una).
<style> Sus etiquetas son: <style> y </style> (ambas obligatorias).
<title> El elemento <title> HTML define el título del documento que se muestra en un Browser la barra de título o la pestaña de una página. Solo contiene texto; las etiquetas dentro del elemento se ignoran.

Seccionamiento básico

Element Description
<body> El elemento <body> de HTML representa el contenido de un documento HTML. Solo puede haber un elemento <body> en un documento.

Seccionamiento del contenido

Los elementos de seccionamiento del contenido te permiten organizar los contenidos del documento en partes lógicas. Usa los elementos de seccionado para crear una descripción amplia de los contenidos de tu página, incluyendo el encabezado y pie de página y elementos para identificar secciones.

Element Description
<address> El elemento HTML <address> aporta información de contacto para su article más cercano o ancestro body; en el último caso lo aplica a todo el documento.
<article> El Elemento de HTML <article> representa una composición auto-contenida en un documento, una página, una aplicación o en un sitio, que se quiere que sea distribuíble y/o reutilizable de manera independiente, por ejemplo, en la redifusión. Algunos ejemplos podrían ser un mensaje en un foro, un artículo de una revista o un periódico, una entrada de blog, el comentario de un usuario, un widget o gadget interactivo, o cualquier otro elemento de contenido independiente.
<aside> El elemento HTML <aside> representa una sección de una página que consiste en contenido que está indirectamente relacionado con el contenido principal del documento. Estas secciones son a menudo representadas como barras laterales o como inserciones y contienen una explicación al margen como una definición de glosario, elementos relacionados indirectamente, como publicidad, la biografía del autor, o en aplicaciones web, la información de perfil o enlaces a blogs relacionados.
<footer> El Elemento HTML Footer (<footer>) representa un pie de página para el contenido de sección más cercano o el elemento raíz de sección (p.e, su ancestro mas cercano <article>, <aside>, <nav>, <section>,<blockquote>, <body>, <details>, <fieldset>, <figure>, <td>). Un pie de página típicamente contiene información acerca de el autor de la sección, datos de derechos de autor o enlaces a documentos relacionados.
<header> El elemento de HTML Header (<header>) representa un grupo de ayudas introductorias o de navegación. Puede contener algunos elementos de encabezado, así como también un logo, un formulario de búsqueda, un nombre de autor y otros componentes.
<h1> (en-US), <h2> (en-US), <h3> (en-US), <h4> (en-US), <h5> (en-US), <h6> (en-US) Los elementos de encabezado implementan seis niveles de encabezado del documento, <h1> es el más importante, y <h6>, el menos importante. Un elemento de encabezado describe brevemente el tema de la sección que presenta. La información de encabezado puede ser usada por los agentes usuarios, por ejemplo, para construir una tabla de contenidos para un documento automáticamente.
<main> El elemento HTML <main> representa el contenido principal del body de un documento o aplicación. El área principal del contenido consiste en el contenido que está directamente relacionado, o se expande sobre el tema central de un documento o la funcionalidad central de una aplicación. Este contenido debe ser único al documento, excluyendo cualquier contenido que se repita a través de un conjunto de documentos como barras laterales, enlaces de navegación, información de derechos de autor, logos del sitio y formularios de búsqueda (a menos, claro, que la función principal del documento sea un formulario de búsqueda).
<nav> El elemento HTML <nav> representa una sección de una página cuyo propósito es proporcionar enlaces de navegación, ya sea dentro del documento actual o a otros documentos. Ejemplos comunes de secciones de navegación son menús, tablas de contenido e índices.
<section> El elemento de HTML section (<section>) representa una sección genérica de un documento. Sirve para determinar qué contenido corresponde a qué parte de un esquema. Piensa en el esquema como en el índice de contenido de un libro; un tema común y subsecciones relacionadas. Es, por lo tanto, una etiqueta semántica. Su funcionalidad principal es estructurar semánticamente un documento a la hora de ser representado por parte de un agente usuario. Por ejemplo, un agente de usuario que represente el documento en voz, podría exponer al usuario el índice de contenido por niveles para navegar rápidamente por las distintas partes.

Contenido del texto

Utiliza los elementos HTML de contenido del texto para organizar bloques o secciones de contenido colocados entre los tags de apertura<body> y cierre. Es importante para la accessibility y el SEO, que estos elementos se identifiquen con el objetivo o la estructura de ese contenido.

Element Description
<blockquote> Sus etiquetas son: <blockquote> y </blockquote> (ambas obligatorias).
<dd> El elemento HTML <dd> provee detalles acerca de o la definición de un término precedente (dt) en una lista de descripciones (dl).
<div> Sus etiquetas son: <div> y </div> (ambas obligatorias).
<dl> El elemento HTML <dl> representa una lista descriptiva. El elemento encierra una lista de grupos de términos (especificados con el uso del elemento dt) y de descripciones (proveídas con elementos dd). Algunos usos comunes para este elemento son implementar un glosario o para desplegar metadatos (lista de pares llave-valor).
<dt> El elemento HTML <dt> especifica un término en una descripción o lista de definiciones, y como tal debe utilizarse dentro de un elemento dl Es usualmente seguido por un elemento dd; sin embargo, múltiples elementos <dt> en un renglón indican diferentes términos los cuales todos son definidos por el siguiente elemento dd.
<figcaption> El elemento HTML <figcaption> representa un subtítulo o leyenda asociado al contenido del elemento padre figure, pudiendo ser colocado como primer o último hijo. Es importante destacar que el elemento <figcaption> es opcional.
<figure> El elemento HTML <figure> representa contenido independiente, a menudo con un título. Si bien se relaciona con el flujo principal, su posición es independiente de éste. Por lo general, se trata de una imagen, una ilustración, un diagrama, un fragmento de código, o un esquema al que se hace referencia en el texto principal, pero que se puede mover a otra página o a un apéndice sin que afecte al flujo principal.
<hr> Sus etiquetas son: <hr/> (solo tiene una).
<li> Sus etiquetas son: <li> y </li> (la de cierre es opcional).
<menu> Sus etiquetas son: <menu> y </menu> (ambas obligatorias).
<ol> Sus etiquetas son: <ol> y </ol> (ambas obligatorias).
<p> Sus etiquetas son: <p> y </p> (la de cierre es opcional).
<pre> El Elemento HTML <pre> (o Texto HTML Preformateado) representa texto preformateado. El texto en este elemento típicamente se muestra en una fuente fija, no proporcional, exactamente como es mostrado en el archivo. Los espacios dentro de este elemento también son mostrados como están escritos.
<ul> Sus etiquetas son: <ul> y </ul> (ambas obligatorias).

Semántica del texto en línea

Utilice la semántica del texto en línea HTML para definir el significado, estructura, o el estilo de una palabra, una línea o cualquier pieza arbitraria de texto.

Element Description
<a> El Elemento HTML Anchor <a> crea un enlace a otras páginas de internet, archivos o ubicaciones dentro de la misma página, direcciones de correo, o cualquier otra URL.
<abbr> El elemento HTML <abbr> (o Elemento de Abreviación HTML) representa una abreviación o acrónimo; el atributo opcional title puede ampliar o describir la abreviatura. Si está presente, el atributo title debe contener la descripción completa y nada más.
<b> b de bold=negrita.
<bdi> El elemento _HTML <bdi> _(o elemento de aislamiento Bi-Direccional) aisla un trozo de texto para que pueda ser formateado con una dirección diferente al texto que hay fuera de él.
<bdo> bdo Bi-Directional Overriding=Anulación de bidireccionalidad.
<br> El elemento HTML line break <br> produce un salto de línea en el texto (retorno de carro). Es útil para escribir un poema o una dirección, donde la división de las líneas es significante.
<cite> Sus etiquetas son: <cite> y </cite> (ambas obligatorias)
<code> Sus etiquetas son: <code> y </code> (ambas obligatorias)
<data> El Elemento HTML <data> vincula un contenido dado con una traducción legible por una máquina. Si el contenido está relacionado con time- o date-, debe usarse el elemento time.
<dfn> Sus etiquetas son: <dfn> y </dfn> (ambas obligatorias)
<em> El elemento HTML <em> es el apropiado para marcar con énfasis las partes importantes de un texto. El elemento <em> puede ser anidado, con cada nivel de anidamiento indicando un mayor grado de énfasis.
<i> Sus etiquetas son: <i> y </i> (Ambas obligatorias)
<kbd> Sus etiquetas son: <kbd> y </kbd> (ambas obligatorias)
<mark> El Elemento HTML Mark <mark> representa un texto marcado o resaltado como referencia o anotación, debido a su relevancia o importancia en un contexto particular.
<q> El elemento HTML <q> indica que el texto adjunto es una cita corta en línea. La mayoría de los navegadores modernos implementan esto rodeando el texto entre comillas. Este elemento está destinado a citas breves que no requieren saltos de párrafo; para citas de bloque independiente, utiliza el elemento blockquote.
<rp> (en-US)
<rt> (en-US)
<ruby> (en-US)
<s> Sus etiquetas son: <s> y </s> (Ambas obligatorias)
<samp> El elemento HTML Sample (<samp>) se utiliza para incluir texto en línea que representa una muestra (o cita) de la salida de un programa de ordenador. El contenido de esta etiqueta es renderizado generalmente usando la tipografía monoespaciada por defecto del navegador.
<small> El elemento HTML <small> hace el tamaño del texto una talla más pequeña (por ejemplo, de largo a mediano, o de pequeño a extra pequeño) que el tamaño mínimo de fuente del navegador. En HTML5, este elemento es reutilizado para representar comentarios laterales y letra pequeña, incluyendo derechos de autor y texto legal, independientemente de su estilo de presentación.
<span> Sus etiquetas son: <span> y </span> (ambas obligatorias).
<strong> Sus etiquetas son: <strong> y </strong> (ambas obligatorias)
<sub> El elemento HTML <sub> define un fragmento de texto que se debe mostrar, por razones tipográficas, más bajo, y generalmente más pequeño, que el tramo principal del texto, es decir, en subíndice.
<sup> El elemento HTML <sup> define un fragmento de texto que se debe mostrar, por razones tipográficas, más alto, y generalmente más pequeño, que el tramo principal del texto, es decir, en superíndice.
<time> El elemento HTML <time> representa un periodo específico en el tiempo. Puede incluir el atributo datetime para convertir las fechas en un formato interno legible por un ordenador, permitiendo mejores resultados en los motores de búsqueda o características personalizadas como recordatorios.
<u> Sus etiquetas son: <u> y </u> (Ambas obligatorias)
<var> Sus etiquetas son: <var> y </var> (ambas obligatorias)
<wbr> El elemento HTML word break opportunity <wbr> representa una posición dentro del texto donde el explorador puede opcionalmente saltar una línea , aunque sus reglas de salto de línea de otra manera no crearían un salto en esa posición .En páginas codificadas en UTF-8 , <wbr> se comporta como el punto de código U+200B ZERO-WIDTH SPACE. En particular se comporta como un punto de código unicode bidi BN , significando esto que no tiene efecto en ordenamiento bidi : <div dir=rtl>123,<wbr>456</div> muestra , cuando no se rompa en dos líneas , 123, 456 y no 456 , 123 .

Imagen y multimedia

HTML soporta varios recursos multimedia como imágenes, audio, y video.

Element Description
<area> area de area=área
<audio> El elemento audio se usa para insertar contenido de audio en un documento HTML o XHTML. El elemento audio se agregó como parte de HTML 5.
<img> El elemento de imagen HTML <img> representa una imagen en el documento.
<map> Sus etiquetas son: <map> y </map> (ambas obligatorias).
<track> El elemento HTML <track> se utiliza como elemento hijo de los elementos multimedia, audio y video. Le permite especificar pistas de texto cronometradas (o datos basados en el tiempo), por ejemplo, para manejar subtítulos automáticamente. Las pistas están formateadas en formato WebVTT (en-US) (archivos .vtt): Web Video Text Tracks (pistas de texto de video web).
<video> El elemento video se utiliza para incrustar vídeos en un documento HTML o XHTML.

Contenido incrustado

Además de los contenidos multimedia habituales, HTML puede incluir otra variedad de contenidos, aunque no siempre es fácil de interactuar con ellos.

Element Description
<embed> El Elemento HTML Embed ( <embed> ) representa un punto de integración para una aplicación externa o de contenido interactivo (en otras palabras, un plug-in).
<iframe> El elemento HTML <iframe> (de inline frame) representa un contexto de navegación anidado, el cual permite incrustrar otra página HTML en la página actual.
<object> El elemento HTML <object> representa un recurso externo, que puede ser tratado como una imagen, un contexto de navegación anidado, o como un recurso que debe ser manejado por un plugin.
<picture> El elemento HTML <picture> es un contenedor usado para especificar múltiples elementos source y un elemento img contenido en él para proveer versiones de una imagen para diferentes escenarios de dispositivos. Si no hay coincidencias con los elementos <source>, el archivo especificado en los atributos src del elemento <img> es utilizado. La imagen seleccionada es entonces presentada en el espacio ocupado por el elemento <img>.
<portal> (en-US)
<source> El elemento HTML <source> especifica recursos de medios múltiples para los elementos picture, audio, o video. Es un elemento vacío. Normalmente se utiliza para servir el mismo contenido multimedia en varios formatos soportados por diferentes navegadores (en-US).

Scripting

Con el fin de crear contenido dinámico y aplicaciones Web, HTML soporta el uso de lenguajes de scripting, el más prominente es JavaScript. Ciertos elementos soportan esta capacidad.

Element Description
<canvas> El elemento HTML canvas (<canvas>) se puede utilizar para dibujar gráficos a través de secuencias de comandos (por lo general JavaScript ). Por ejemplo, puede usarse para dibujar gráficos, hacer composiciones de fotos o incluso realizar animaciones.
<noscript> Sus etiquetas son: <noscript> y </noscript> (ambas obligatorias).
<script> (en-US)

Ediciones demarcadas

Estos elementos permiten proporcionar indicios de que determinadas partes del texto han sido alteradas.

Element Description
<del> Sus etiquetas son: <del> y </del> (ambas obligatorias).
<ins> Sus etiquetas son: <ins> e </ins> (ambas obligatorias).

Tablas

Estos elementos son usados para crear y manejar datos tabulados.

Element Description
<caption> Sus etiquetas son: <caption> y </caption> (ambas obligatorias).
<col> Sus etiquetas son: <col> (solo tiene una).
<colgroup> Sus etiquetas son: <colgroup> y </colgroup> (la de cierre es opcional).
<table> El Elemento de Tabla HTML (<table>) representa datos en dos o mas dimensiones.
<tbody> (en-US)
<td> El elemento HTML Celda de tabla (<td>) define la celda de una tabla que contiene datos. Esta participa en el modelo de tablas.
<tfoot> (en-US)
<th> El elemento HTML <th> define una celda como encabezado de un grupo de celdas en una tabla. La naturaleza exacta de este grupo está definida por los atributos scope y headers.
<thead> (en-US)
<tr> El elemento HTML fila de tabla (table row) <tr> define una fila de celdas en una tabla. Estas pueden ser una mezcla de elementos td y th.

Formularios

HTML provee un número de elementos que pueden usarse conjuntamente para crear formularios los cuales el usuario puede completar y enviar al sitio Web o a una aplicación. Hay una gran cantidad de información acerca de ésto disponible en la HTML forms guide (en-US).

Element Description
<button> button = botón.
<datalist> El elemento HTML <datalist> contiene un conjunto de elementos option que representan los valores disponibles para otros controles.
<fieldset> Sus etiquetas son: <fieldset> y </fieldset> (ambas obligatorias).
<form> El elemento HTML form (<form>) representa una sección de un documento que contiene controles interactivos que permiten a un usuario enviar información a un servidor web.
<input> El elemento HTML <input> se usa para crear controles interactivos para formularios basados en la web con el fin de recibir datos del usuario.Hay disponible una amplia variedad de tipos de datos de entrada y widgets de control, que dependen del dispositivo y el agente de usuario (user agent (en-US)).El elemento <input> es uno de los más potentes y complejos en todo HTML debido a la gran cantidad de combinaciones de tipos y atributos de entrada.
<label> El Elemento HTML <label> representa una etiqueta para un elemento en una interfaz de usuario. Este puede estar asociado con un control ya sea mediante la utilizacion del atributo for, o ubicando el control dentro del elemento label. Tal control es llamado "el control etiquetado" del elemento label.
<legend> Sus etiquetas son: <legend> y </legend> (ambas obligatorias).
<meter> (en-US)
<optgroup> (en-US)
<option> En un formulario Web , el elemento HTML <option> se usa para representar un item dentro de un select, un optgroup o un elemento HTML5 datalist .
<output> (en-US)
<progress> La etiqueta HTML <progress> se utiliza para visualizar el progreso de una tarea. Aunque los detalles de como se muestran depende directamente del navegador que utiliza el cliente, aunque básicamente aparece una barra de progreso.
<select> El elemento select (<select>) de HTML representa un control que muestra un menú de opciones. Las opciones contenidas en el menú son representadas por elementos option, los cuales pueden ser agrupados por elementos optgroup. La opcion puede estar preseleccionada por el usuario.
<textarea> El elemento HTML <textarea> representa un control para la edición mutilínea de texto sin formato.

Elementos Interactivos

HTML ofrece una selección de elementos que pueden ayudar a crear objetos de interfaz de usuario interactivos.

Element Description
<details> El elemento HTML Details <details> es usado como un widget de revelación a través del cual el usuario puede obtener información adicional .
<dialog> El elemento HTML <dialog> representa una caja de diálogo u otro componente interactivo, como inspector o ventana.
<summary> (en-US)

Componentes Web

Los Componentes Web son una tecnología relacionada con HTML que hacen que sea posible, en esencia, crear y personalizar elementos como si fueran HTML normal. Además, pueden crear versiones personalizadas de los elementos HTML estándar.

Element Description
<content> El elemento HTML <content> es usado dentro de un Shadow DOM como un insertion point . No está pensado para ser usado en HTML ordinario . Es usado con Web Components.
<shadow> (en-US)
<slot> El elemento HTML <slot> —parte de la suite tecnologica Web Components — es un placeholder en un componente que tu puedes llenar con tu propio marcado, que te permite crear árboles DOM por separado y presentarlos juntos.
<template> El elemento HTML <template> es un mecanismo para mantener el contenido HTML del lado del cliente que no se renderiza cuando se carga una página, pero que posteriormente puede ser instanciado durante el tiempo de ejecución empleando JavaScript.

Elementos obsoletos y en desuso

Advertencia: Estos son elementos HTML viejos los cuales están obsoletos y no deben usarse. Nunca debería usarlos en un nuevo proyecto y debería reemplazarlos en proyectos viejos tan pronto como sea posible. Se listan aquí solo con propósitos informativos.

Element Description
<acronym> acromym de acromyn=acrónimo
<applet> Sus etiquetas son: <applet> y </applet> (ambas obligatorias)
<bgsound> El elemento HTML de sonido de fondo (<bgsound>) es un elemento de Internet Explorer que asocia un sonido de fondo con un página .
<big> big de big=grande
<blink> El elemento HTML blink (<blink>) no es un elemento estándar que causa que el texto encerrado parpadee lentamente .
<center> Sus etiquetas son: <center> y </center> (ambas obligatorias).
<content> El elemento HTML <content> es usado dentro de un Shadow DOM como un insertion point . No está pensado para ser usado en HTML ordinario . Es usado con Web Components.
<dir> Sus etiquetas son: <dir> y </dir> (ambas obligatorias).
<font> Sus etiquetas son: <font> y </font> (ambas obligatorias).
<frame> Sus etiquetas son: <frame> (solo tiene una).
<frameset> Sus etiquetas son: <frameset> y </frameset> (ambas obligatorias).
<image> El elemento HTML <image> fue un elemento experimental diseñado para mostrar imágenes . Nuca fue implementado y el elemento estándar img debe de ser usado .
<keygen> El elemento keygen de HTML existe para facilitar la generación de llaves, y el envío de la clave pública como parte de un formulario HTML. Este mecanismo está diseñado para utilizarse con sistemas de gestión de certificados basados en la Web. Se espera que el elemento keygen se utilice en un formulario HTML, junto con otra información necesaria para la construcción de una solicitud de certificado, y que el resultado del proceso será un certificado firmado.
<marquee> La etiqueta html <marquee> se utiliza para insertar un area de texto en movimiento. También se la conoce como marquesina.
<menuitem> (en-US)
<nobr> El elemento HTML <nobr> previene que una línea de texto se divida en una nueva línea, así, se presentará en una línea larga por lo que puede ser necesario hacer un desplazamiento de pantalla. Esta etiqueta no es un estándar HTML y no debería ser usada, en su lugar use la propiedad CSS white-space como en este ejemplo:
<noembed> (en-US)
<noframes> Sus etiquetas son: <noframes> y </noframes> (ambas obligatorias).
<param> Sus etiquetas son: <param> (solo tiene una).
<plaintext> (en-US)
<rb> (en-US)
<rtc> (en-US)
<shadow> (en-US)
<spacer> (en-US)
<strike> Sus etiquetas son: <strike> y </strike> (Ambas obligatorias)
<tt> Sus etiquetas son: <tt> y </tt> (Ambas obligatorias)
<xmp> El elemento HTML example element <xmp> dibuja texto entre las etiquetas de inicio y fin sin interpretar el HTML que se encuentra en medio y lo muestra usando un tipo de letra monoespaciada . La especificación de HTML2 recomendaba que que esta debería de ser dibujada suficientemente amplia para permitir 80 caracteres por línea .