Descubre y prueba una amplia gama de elementos y atributos HTML, organizados por categorías y actualizados con los estándares de HTML5.
El elemento `html` es el elemento raíz de un documento HTML. Todos los demás elementos deben ser descendientes de este.
Contiene metadatos sobre el documento, como su título, enlaces a hojas de estilo, scripts y otra información que no se muestra directamente en la página.
Representa el contenido principal y visible de un documento HTML. Solo puede haber un elemento `body` en un documento.
Define el título del documento que se muestra en la barra de título del navegador o en la pestaña. Es un metadato esencial para la usabilidad y el SEO.
Se utiliza para especificar metadatos que no pueden ser expresados por otros elementos `meta` HTML, como `base`, `link`, `script`, `style` o `title`. Crucial para el `charset`, `viewport`, y descripciones para motores de búsqueda.
Establece la relación entre el documento actual y un recurso externo, como una hoja de estilo CSS o un icono de favicon.
Los elementos `h1` a `h6` definen los títulos o encabezados de una sección. `h1` es el más importante (título principal) y `h6` el menos importante (subtítulo de menor nivel).
El elemento `p` se utiliza para definir un párrafo de texto. Es uno de los elementos de bloque más comunes para contenido textual.
El elemento `strong` se utiliza para indicar que el texto tiene una gran importancia. Los navegadores suelen mostrarlo en negrita.
El elemento `em` se utiliza para enfatizar el texto. Los navegadores suelen mostrarlo en cursiva.
El elemento `b` se utiliza para poner texto en negrita sin darle un énfasis semántico especial, a diferencia de `strong`.
El elemento `i` se utiliza para poner texto en cursiva sin darle un énfasis semántico especial, a diferencia de `em`.
El elemento `mark` se utiliza para resaltar texto que es relevante o importante en un contexto particular.
El elemento `small` representa comentarios a pie de página y letra pequeña, incluyendo avisos de derechos de autor y texto legal.
El elemento `del` representa un rango de texto que ha sido eliminado de un documento.
El elemento `ins` representa un rango de texto que ha sido añadido a un documento.
El elemento `sub` especifica texto en subíndice.
El elemento `sup` especifica texto en superíndice.
El elemento `code` se utiliza para mostrar fragmentos de código de programación.
El elemento `pre` representa texto preformateado, que se mostrará en una fuente monoespaciada, preservando los espacios en blanco y los saltos de línea.
El elemento `blockquote` indica que el texto adjunto es una cita extendida de una fuente.
El elemento `q` se utiliza para citas cortas en línea.
El elemento `abbr` representa una abreviación o un acrónimo. El atributo `title` puede usarse para proporcionar la descripción completa.
El elemento `address` proporciona información de contacto para el autor/propietario del documento o de un artículo/trabajo.
El elemento `cite` se utiliza para citar el título de una obra creativa (libro, canción, película, pintura, etc.).
El elemento `bdo` (Bidirectional Override) anula la dirección actual del texto.
El elemento `data` vincula un contenido dado con una traducción legible por máquina. Útil para microdatos o datos de esquema.
El elemento `time` representa un momento específico en el tiempo o un rango de tiempo. El atributo `datetime` proporciona una representación legible por máquina.
El elemento `a` (anchor) se utiliza para crear hipervínculos a otras páginas web, archivos, ubicaciones dentro de la misma página, o a direcciones de correo electrónico. El atributo `href` es esencial para especificar el destino del enlace.
El elemento `img` se utiliza para incrustar una imagen en el documento. Es un elemento de reemplazo (vacío), lo que significa que su contenido es sustituido por el recurso al que apunta.
El elemento `audio` se utiliza para incrustar contenido de audio en un documento HTML.
El elemento `video` se utiliza para incrustar un reproductor de video en un documento HTML.
El elemento `source` se utiliza dentro de los elementos `audio` y `video` para especificar múltiples recursos multimedia. El navegador elegirá el primer formato que pueda reproducir.
El elemento `track` se utiliza como hijo de `audio` o `video` para especificar pistas de texto cronometradas, como subtítulos, leyendas o descripciones de audio.
El elemento `ul` representa una lista de elementos que no tienen un orden particular o secuencial.
El elemento `ol` representa una lista de elementos que tienen un orden secuencial o numérico.
El elemento `li` se utiliza para representar un elemento dentro de una lista ordenada (`ol`) o desordenada (`ul`).
Se utilizan para crear una lista de descripciones o definiciones.
El elemento `div` es un contenedor genérico a nivel de bloque para contenido. No tiene significado semántico por sí mismo y se utiliza principalmente para agrupar elementos para aplicar estilos con CSS o manipular con JavaScript.
El elemento `span` es un contenedor genérico en línea para contenido. Al igual que `div`, no tiene significado semántico y se usa para agrupar pequeños fragmentos de contenido o texto para aplicar estilos.
El elemento `header` representa contenido introductorio o un grupo de ayudas para la navegación. Puede contener un encabezado, un logo, un formulario de búsqueda, etc.
El elemento `nav` representa una sección de un documento que contiene enlaces de navegación.
El elemento `main` representa el contenido dominante del `body` de un documento. Debe haber solo un elemento `main` por documento y no debe ser descendiente de elementos como `article`, `aside`, `footer`, `header` o `nav`.
El elemento `footer` representa un pie de página para su contenido de sección o raíz de sector más cercano. Generalmente contiene información sobre el autor, derechos de autor, enlaces relacionados, etc.
El elemento `section` representa una sección genérica independiente de un documento, generalmente con un encabezado. Es una forma de agrupar contenido relacionado semánticamente.
El elemento `article` representa contenido independiente y auto-contenido, como una entrada de blog, un comentario de usuario, una revista o un periódico. Debe ser distribuible de forma independiente.
El elemento `aside` representa una sección de una página cuyo contenido está indirectamente relacionado con el contenido principal. Se utiliza a menudo para barras laterales, bloques de citas, publicidad, etc.
El elemento `figure` representa contenido auto-contenido, a menudo una imagen, diagrama, código o tabla. El elemento `figcaption` proporciona un título o leyenda para la `figure`.
El elemento `details` crea un widget de divulgación en el que la información se puede mostrar u ocultar. El elemento `summary` proporciona un resumen visible o una leyenda para los detalles.
El elemento `dialog` representa un cuadro de diálogo o un componente interactivo, como una alerta o ventana modal.
El elemento `table` se utiliza para crear tablas HTML para mostrar datos tabulares.
Estos son los elementos básicos para construir una tabla:
Estos elementos se utilizan para agrupar filas de una tabla semánticamente:
El elemento `caption` especifica el título de una tabla, proporcionando un resumen conciso de su contenido.
Se utilizan para agrupar y aplicar estilos a columnas de una tabla.
El elemento `form` se utiliza para crear un formulario HTML para la entrada de usuario. Puede contener varios elementos de formulario como `input`, `textarea`, `select`, `button`, etc.
El elemento `input` se utiliza para crear controles interactivos en formularios web para recibir datos del usuario. El atributo `type` es crucial para definir el tipo de entrada.
El elemento `textarea` define un control de entrada de texto de varias líneas. Útil para comentarios largos o descripciones.
El elemento `select` crea un control de menú desplegable. Cada opción dentro del menú se define con el elemento `option`.
El elemento `label` representa una leyenda para un elemento en una interfaz de usuario. Al hacer clic en un `label`, se activa el control de formulario asociado.
El elemento `button` se utiliza para crear un botón clickeable. Puede ser usado para enviar formularios, activar funciones de JavaScript, etc.
El elemento `fieldset` se utiliza para agrupar elementos relacionados en un formulario. El elemento `legend` proporciona un título para el `fieldset`.
El elemento `datalist` contiene una lista de elementos `option` que representan las opciones predefinidas para un control `input`. El `input` debe tener un atributo `list` que coincida con el `id` del `datalist`.
El elemento `output` representa el resultado de un cálculo o la acción de un usuario.
El elemento `progress` representa el progreso de una tarea.
El elemento `meter` representa un valor escalar dentro de un rango conocido. Es útil para mostrar valores como el uso de disco, la relevancia de un resultado de consulta, etc.
El elemento `iframe` se utiliza para incrustar otro documento HTML dentro del documento HTML actual. Esto crea un "marco en línea".
El elemento `canvas` se utiliza para dibujar gráficos mediante JavaScript. Permite renderizar gráficos 2D y 3D (con WebGL).
El elemento `svg` se utiliza para incrustar gráficos vectoriales escalables directamente en el HTML. Permite crear gráficos que no pierden calidad al escalarse.
Se utilizan para crear un mapa de imagen, donde diferentes áreas de una imagen son clickeables y actúan como enlaces.
El elemento `script` se utiliza para incrustar o hacer referencia a un script ejecutable (generalmente JavaScript) dentro del documento HTML. En HTML5, los scripts se cargan y ejecutan de forma no bloqueante por defecto si se colocan en el `head`.
El elemento `style` contiene información de estilo para el documento o partes del documento. Generalmente se coloca en el `head`.
El elemento `br` se utiliza para producir un salto de línea dentro de un bloque de texto. Es un elemento de vacío (no tiene contenido ni etiqueta de cierre).
El elemento `hr` se utiliza para dibujar una línea horizontal que indica una división temática en el contenido, como un cambio de tema o sección.