Elemento HTML

Un elemento HTML es un tipo de componente de documento HTML ( Lenguaje de Marcado de Hipertexto ), uno de varios tipos de nodos HTML (algunos tipos de nodos comunes incluyen nodos de documento, fragmento de documento, interfaz y atributo ). ^{[ 1 ]} La primera versión utilizada de HTML fue escrita por Tim Berners-Lee en 1993 y desde entonces ha habido muchas versiones de HTML. El estándar de facto actual está regido por el grupo industrial WHATWG y se conoce como HTML Living Standard .

Un documento HTML se compone de una estructura jerárquica formada por nodos HTML simples, como nodos de texto, y elementos HTML, que añaden semántica y formato a partes del documento (por ejemplo, poner texto en negrita, organizarlo en párrafos, listas y tablas, o insertar hipervínculos e imágenes). Cada elemento puede tener atributos HTML específicos. Los elementos también pueden contener contenido, incluyendo otros elementos y texto.

Conceptos

Elementos vs. etiquetas

Como es de entender general, la posición de un elemento se indica como aquella que se extiende desde una etiqueta de inicio hasta una etiqueta de cierre. ^{[ 2 ]} Este es el caso de muchos, pero no de todos, los elementos dentro de un documento HTML. La distinción se enfatiza explícitamente en la especificación HTML 4.01 : ^{[ 3 ]}

Los elementos no son etiquetas. Algunas personas se refieren a los elementos como etiquetas (por ejemplo, "la etiqueta P"). Recuerda que el elemento es una cosa y la etiqueta (ya sea de inicio o de fin) es otra. Por ejemplo, el elemento HEAD siempre está presente, aunque las etiquetas HEAD de inicio y fin no estén presentes en el código.

De manera similar, la Recomendación HTML 5.1 2nd Edition del W3C dice explícitamente: ^{[ 4 ]}

Las etiquetas se utilizan para delimitar el inicio y el final de los elementos en el marcado. [...] Las etiquetas de inicio y fin de ciertos elementos normales pueden omitirse. [...] El contenido del elemento debe colocarse justo después de la etiqueta de inicio (que puede estar implícita en algunos casos) y justo antes de la etiqueta de fin (que, de nuevo, puede estar implícita en algunos casos).

y: ^{[ 4 ]}

Se pueden omitir ciertas etiquetas. NOTA: Omitir la etiqueta de inicio de un elemento [...] no significa que el elemento no esté presente; se sobreentiende, pero sigue estando ahí. Por ejemplo, un documento HTML siempre tiene un <html>elemento raíz, aunque la cadena <html>no aparezca en ninguna parte del marcado.

Como HTML (antes de HTML5 ) se basa en SGML , ^{[ 5 ]} su análisis también depende de la Definición de Tipo de Documento (DTD), específicamente una DTD de HTML (por ejemplo, HTML 4.01). ^{[ 6 ]}^{[ nota 1 ]} La DTD especifica qué tipos de elementos son posibles (es decir, define el conjunto de tipos de elementos) y también las combinaciones válidas en las que pueden aparecer en un documento. Es parte del comportamiento general de SGML que, cuando solo es posible una estructura válida (según la DTD), su declaración explícita en cualquier documento dado generalmente no es necesaria. Como ejemplo simple, la etiqueta que indica el inicio de un elemento de párrafo debe complementarse con una etiqueta que indique su final. Pero como la DTD establece que los elementos de párrafo no pueden anidarse, un fragmento de documento HTML se infiere que es equivalente a . (Si un elemento de párrafo no puede contener otro, cualquier párrafo actualmente abierto debe cerrarse antes de comenzar otro). Dado que esta implicación se basa en la combinación de la DTD y el documento individual, normalmente no es posible inferir elementos solo a partir de las etiquetas del documento , sino únicamente mediante un analizador sintáctico compatible con SGML o HTML que conozca la DTD. HTML5 genera un resultado similar al definir qué etiquetas se pueden omitir. ^[⁷^]<p></p><p>Para 1 <p>Para 2 <p>Para 3<p>Para 1 </p><p>Para 2 </p><p>Para 3

SGML frente a XML

SGML es complejo, lo que ha limitado su comprensión y adopción generalizadas. XML se desarrolló como una alternativa más sencilla. Si bien ambos pueden usar la DTD para especificar los elementos admitidos y sus combinaciones permitidas como estructura del documento, el análisis de XML es más simple. La relación entre etiquetas y elementos siempre implica el análisis de las etiquetas reales incluidas en el documento, sin los cierres implícitos que forman parte de SGML. ^{[ nota 2 ]}

Es probable que el HTML utilizado en la web actual se trate como XML, al ser XHTML , o como HTML5; en ambos casos, el análisis de las etiquetas del documento en elementos del Modelo de Objetos del Documento (DOM) se simplifica en comparación con los sistemas HTML heredados. Una vez obtenido el DOM de los elementos, el comportamiento en niveles superiores de la interfaz (por ejemplo, la representación en pantalla) es idéntico o casi idéntico. ^{[ nota 3 ]}

`%block;`vs. caja

Parte de este comportamiento de presentación de CSS es la noción del " modelo de caja ". Este se aplica a aquellos elementos que CSS considera elementos de "bloque", definidos mediante la declaración CSS.display:block;

HTML también tiene un concepto similar, aunque diferente, y ambos se confunden con mucha frecuencia. %block;y %inline;son grupos dentro de la DTD de HTML que agrupan elementos como "de nivel de bloque" o "en línea". ^{[ 9 ]} Esto se utiliza para definir su comportamiento de anidamiento: los elementos de nivel de bloque no pueden colocarse en un contexto en línea. ^{[ nota 4 ]} Este comportamiento no se puede cambiar; está fijo en la DTD. Los elementos de bloque y en línea tienen los comportamientos CSS apropiados y diferentes adjuntos a ellos por defecto, ^{[ 9 ]} incluyendo la relevancia del modelo de caja para tipos de elementos particulares.

Tenga en cuenta que este comportamiento CSS puede modificarse, y de hecho se modifica con frecuencia, respecto al valor predeterminado. Las listas con elementos y se presentan como elementos de bloque por defecto. Sin embargo, es bastante común configurarlas con CSS para que se muestren como una lista en línea. ^[¹⁰^]<ul><li> ...%block;

Descripción general

Sintaxis

\overbrace {\overbrace {{\mathtt {\color {BrickRed}<\!p\ }}\color {Magenta}\underbrace {\mathtt {class}} _{\mathsf {\color {Black}{Attribute \atop name}}}{\mathtt {=''}}\!\underbrace {\mathtt {paragraph}} _{\mathsf {\color {White}{Attr} \atop \color {Black}Attribute\ value}}''{\mathtt {\color {BrickRed}>}}} ^{\mathsf {Start\ tag}}\overbrace {\mathtt {\color {Green}This\ is\ a\ paragraph.}} ^{\mathsf {Content}}\overbrace {\mathtt {\color {BrickRed}<\!/p\!>}} ^{\mathsf {End \atop tag}}} ^{\mathsf {Elemento}}

Partes de un elemento contenedor HTML

En la sintaxis HTML , la mayoría de los elementos se escriben con una etiqueta de inicio y una etiqueta de cierre, con el contenido entre ellas. Una etiqueta HTML se compone del nombre del elemento, rodeado de corchetes angulares . Una etiqueta de cierre también tiene una barra diagonal después del corchete angular de apertura. ^{[ 11 ]}^{: 23–24} Por ejemplo, un párrafo, que está representado por el elemento, se escribiría como:<p>

<p> En la sintaxis HTML, la mayoría de los elementos se escriben ... </p>

Sin embargo, no todos estos elementos requieren la etiqueta de cierre, ni siquiera la de apertura. ^{[ 7 ]} Algunos elementos, los llamados elementos vacíos , no tienen etiqueta de cierre. Un ejemplo típico es el elemento ( salto de línea duro ). El comportamiento de un elemento vacío está predefinido y no puede contener ningún contenido ni otros elementos. Por ejemplo, una dirección se escribiría como:<br>

<p> P. Sherman </p> <br> 42 Wallaby Way </br> Sídney </p>

Al usar XHTML , es necesario abrir y cerrar todos los elementos, incluidos los elementos vacíos. Esto se puede hacer colocando una etiqueta de cierre inmediatamente después de la etiqueta de apertura, pero esto no es válido en HTML 5 y dará como resultado la creación de dos elementos. Una forma alternativa de especificar que se trata de un elemento vacío, compatible tanto con XHTML como con HTML 5, es colocar una etiqueta /al final de la etiqueta (que no debe confundirse con la etiqueta /al principio de una etiqueta de cierre).

<p> P. Sherman <br /> 42 Wallaby Way <br /> Sídney </p>

Los atributos HTML se especifican dentro de la etiqueta de apertura y se componen del nombre del atributo, seguido de un signo igual y, a continuación, el valor. Por ejemplo: ^{[ 11 ]}^{: 25–26}

< p lang = "en-us" > Párrafo en inglés </p>

Desde HTML5 , HTML permite el uso de nombres de atributos en mayúsculas y la omisión de comillas. ^{[ 11 ]}^{: 26}

De manera informal, a los elementos HTML a veces se les denomina "etiquetas" (un ejemplo de sinécdoque ), aunque muchos prefieren el término etiqueta en referencia estricta al marcado que delimita el inicio y el final de un elemento.

Los nombres de elementos (y atributos) pueden escribirse en cualquier combinación de mayúsculas o minúsculas en HTML, pero deben estar en minúsculas en XHTML. ^{[ 12 ]} La forma canónica era mayúscula hasta HTML 4 , y se usaba en las especificaciones de HTML, pero en los últimos años, las minúsculas se han vuelto más comunes.

Tipos de elementos

Existen tres tipos de elementos HTML : elementos normales, elementos de texto sin formato y elementos vacíos.

Los elementos normales suelen tener una etiqueta de inicio y una etiqueta de cierre, aunque para algunos elementos se puede omitir la etiqueta de cierre, o ambas. Se construye de forma similar:

una etiqueta de inicio ( ) que marca el comienzo de un elemento, que puede incorporar cualquier número de atributos HTML ;<tag>
cierta cantidad de contenido , incluyendo texto y otros elementos;
una etiqueta de cierre , en la que el nombre del elemento está precedido por una barra diagonal : .</tag>

Los elementos de texto sin formato (también conocidos como elementos de texto o elementos de solo texto) se construyen con:

una etiqueta de inicio (con el formato ) que marca el comienzo de un elemento, que puede incorporar cualquier número de atributos HTML;<tag>
cierta cantidad de contenido de texto , pero ningún elemento (todas las etiquetas, excepto la etiqueta de cierre correspondiente, se interpretarán como contenido);
una etiqueta de cierre , en la que el nombre del elemento va precedido de una barra diagonal: . En algunas versiones de HTML, la etiqueta de cierre es opcional para algunos elementos. La etiqueta de cierre es obligatoria en XHTML.</tag>

Un ejemplo es el elemento, que no debe contener otros elementos (incluido el marcado de texto), solo texto plano .<title>

Los elementos vacíos (también llamados a veces elementos simples o independientes) solo tienen una etiqueta de inicio (en el formato), que contiene cualquier atributo HTML. No pueden contener elementos secundarios, como texto u otros elementos. Para compatibilidad conXHTML, la especificación HTMLpermite un espacio y una barra inclinada opcionales(es permisible). La barra inclinada es obligatoria enXHTMLy otrasXML. Dos elementos vacíos comunes son(para unsalto de línea duro, como en un poema o una dirección) y(para unsalto temático). Otros elementos de este tipo suelen ser marcadores de posición que hacen referencia a archivos externos, como elelemento de imagen ( ). Los atributos incluidos en el elemento apuntarán entonces al archivo externo en cuestión. Otro ejemplo de un elemento vacío es, cuya sintaxis es:<tag><tag/><br/><hr/><img/><link/>

< link rel = "stylesheet" href = "fancy.css" type = "text/css" >

Este elemento indica al navegador la hoja de estilos que debe usar para presentar el documento HTML al usuario. En la sintaxis HTML, los atributos no necesitan ir entre comillas si están compuestos únicamente por ciertos caracteres: letras, dígitos, el guion y el punto. En cambio, al usar la sintaxis XML (XHTML), todos los atributos deben ir entre comillas y se requiere una barra diagonal con espacio antes del último corchete angular.<link/>

< link rel = "stylesheet" href = "fancy.css" type = "text/css" />

Atributos

Los atributos HTML definen el comportamiento deseado o indican propiedades adicionales de un elemento. La mayoría de los atributos requieren un valor . En HTML, el valor puede dejarse sin comillas si no incluye espacios (), o puede ir entre comillas simples o dobles (o). En XML , esas comillas son obligatorias.attribute=valueattribute='value'attribute="value"

Por otro lado, los atributos booleanos no requieren que se especifique un valor. Un ejemplo son las checkedcasillas de verificación:

< input type = checkbox checked >

Sin embargo, en la sintaxis XML (y por lo tanto XHTML ), se requiere un valor, y el nombre debe repetirse como valor:

<input type= "checkbox" checked= "checked" />

Estándares de elementos

Los elementos HTML se definen en una serie de estándares abiertos de libre acceso publicados desde 1995, inicialmente por la IETF y posteriormente por la W3C .

Durante la guerra de navegadores de la década de 1990, los desarrolladores de agentes de usuario (por ejemplo, navegadores web ) a menudo creaban sus propios elementos, algunos de los cuales se han incorporado a estándares posteriores. Otros agentes de usuario pueden no reconocer los elementos no estándar y los ignorarán, lo que podría provocar que la página se muestre incorrectamente.

En 1998, XML (una forma simplificada de SGML) introdujo mecanismos para permitir que cualquiera desarrollara sus propios elementos e los incorporara en documentos XHTML , para su uso con agentes de usuario compatibles con XML. ^{[ 13 ]}

Posteriormente, HTML 4.01 se reescribió en un formato compatible con XML , XHTML 1.0 ( HTML extensible ). Los elementos de ambos son idénticos y, en la mayoría de los casos, los documentos XHTML 1.0 válidos serán documentos HTML 4.01 válidos o casi válidos. Este artículo se centra principalmente en HTML estándar, salvo que se indique lo contrario; sin embargo, también es aplicable a XHTML. Consulte la documentación de HTML para obtener información sobre las pequeñas diferencias entre ambos.

Estado del elemento

Desde la primera versión de HTML, varios elementos han quedado obsoletos y se consideran en desuso en estándares posteriores, o simplemente no aparecen, en cuyo caso son inválidos (y los agentes de usuario que validan los encontrarán inválidos y posiblemente no los muestren ). ^{[ 14 ]}

En HTML 4.01 / XHTML 1.0 , el estado de los elementos se complica por la existencia de tres tipos de DTD :

Transitorias , que contienen elementos obsoletos, pero que tenían como objetivo proporcionar un período de transición durante el cual los autores pudieran actualizar sus prácticas;
Frameset , que son versiones de las DTD de transición que también permiten a los autores escribir documentos frameset ;
Strict , que es la forma actualizada (a fecha de 1999) de HTML.

HTML5 proporciona, en cambio, una lista de características obsoletas que acompaña al contenido normativo estandarizado . Se dividen en "obsoletas pero conformes", para las cuales existen instrucciones de implementación, y "no conformes", que deben reemplazarse. ^[¹⁵^]

El primer estándar ( HTML 2.0 ) contenía cuatro elementos obsoletos, uno de los cuales era inválido en HTML 3.2 . Los cuatro son inválidos en HTML 4.01 Transitional , que también declaró obsoletos otros diez elementos. Todos estos, más dos adicionales, son inválidos en HTML 4.01 Strict . Si bien los elementos frame siguen vigentes en el sentido de que están presentes en las DTD Transitional y Frameset, no hay planes para conservarlos en futuros estándares, ya que su función ha sido reemplazada en gran medida y presentan graves problemas de accesibilidad para el usuario.

(Estrictamente hablando, el estándar XHTML más reciente , XHTML 1.1 (2001), no incluye marcos en absoluto; es aproximadamente equivalente a XHTML 1.0 Strict , pero también incluye el módulo de marcado Ruby .) ^{[ 16 ]}

Una fuente común de confusión es el uso impreciso del término "obsoleto" para referirse tanto al estado obsoleto como al inválido, y a elementos que se espera que sean formalmente declarados obsoletos en el futuro.

Contenido frente a presentación y comportamiento

Desde HTML 4, HTML se ha centrado cada vez más en la separación del contenido (el texto e imágenes visibles) de la presentación (como el color, el tamaño de la fuente y el diseño). ^{[ 17 ]} Esto se conoce a menudo como separación de responsabilidades . HTML se utiliza para representar la estructura o el contenido de un documento; su presentación sigue siendo responsabilidad exclusiva de las hojas de estilo CSS . Se sugiere una hoja de estilo predeterminada como parte del estándar CSS, que proporciona una representación predeterminada para HTML. ^{[ 18 ]}

El comportamiento (interactividad) también se mantiene separado del contenido y se gestiona mediante scripts . Las imágenes se encuentran en archivos gráficos independientes del texto, aunque también pueden considerarse parte del contenido de la página.

La separación de responsabilidades permite que el documento sea presentado por diferentes agentes de usuario según sus propósitos y capacidades. Por ejemplo, un agente de usuario puede seleccionar una hoja de estilo apropiada para presentar un documento mediante su visualización en un monitor, impresión en papel o para determinar las características del habla en un agente de usuario exclusivamente de audio. Las funciones estructurales y semánticas del marcado permanecen idénticas en cada caso.

Históricamente, los agentes de usuario no siempre admitieron estas características. En la década de 1990, como solución provisional, se añadieron elementos de presentación (como y ) a HTML, a costa de crear problemas de interoperabilidad y accesibilidad para el usuario. Esto ahora se considera obsoleto y ha sido reemplazado por el diseño basado en hojas de estilo; la mayoría de los elementos de presentación están ahora en desuso. ^[¹⁹^]<b><i>

Los archivos de imagen externos se incorporan con los elementos o . (Con XHTML , el lenguaje SVG también se puede usar para escribir gráficos dentro del documento, aunque vincular a archivos SVG externos suele ser más sencillo). ^[²⁰^] Cuando una imagen no es puramente decorativa, HTML permite proporcionar contenido de reemplazo con un valor semántico similar para agentes de usuario no visuales.<img/><object/>

Un documento HTML también puede ampliarse mediante el uso de scripts para proporcionar comportamientos adicionales que van más allá de las capacidades de los hipervínculos y formularios HTML.

Los elementos y , con sus atributos HTML relacionados , proporcionan hojas de estilo y scripts.<style><script>

En el encabezado del documento, puede enlazar a documentos externos compartidos o contener instrucciones integradas. (El elemento también se puede usar para enlazar hojas de estilo).<style/><script/><style>...</style><script>...</script><link>
<script/>o puede ocurrir en cualquier punto del documento (encabezado o cuerpo).<script>...</script>
El styleatributo es válido en la mayoría de los elementos del cuerpo del documento (por ejemplo, ) para la inclusión de instrucciones de estilo en línea .<divstyle="...">
Los atributos de gestión de eventos , que proporcionan enlaces a scripts, son opcionales en la mayoría de los elementos.
Para los agentes de usuario que no ejecutan scripts, el elemento proporciona contenido alternativo integrado cuando corresponde; sin embargo, solo se puede usar en el encabezado del documento y en el cuerpo como un elemento de nivel de bloque.<noscript>...</noscript>

Elementos de la estructura del documento

<html>...</html>: El elemento raíz de un documento HTML ; todos los demás elementos están contenidos en él. El elemento HTML delimita el principio y el final de un documento HTML.; Se pueden omitir tanto la etiqueta de inicio como la de fin (HTML5). ^{[ 7 ]}; Estandarizado en HTML 2.0 ; sigue vigente.
<head>...</head>: Contenedor para procesar información y metadatos de un documento HTML.; Tanto la etiqueta de inicio como la de fin pueden omitirse e inferirse a partir de los elementos secundarios (HTML5). ^{[ 7 ]}; Estandarizado en HTML 5.0 ; sigue vigente.
<body></body>: Contenedor para el contenido que se puede mostrar en un documento HTML.; Tanto la etiqueta de inicio como la de fin pueden omitirse e inferirse a partir de los elementos secundarios (HTML5). ^{[ 7 ]}; Estandarizado en HTML 2.0 ; sigue vigente.

Elementos de encabezado del documento

<base />

Especifica una URL base para todos los enlaces relativos hrefy otros enlaces en el documento. Debe aparecer antes de cualquier elemento que haga referencia a un recurso externo. HTML permite solo un elemento por documento. Este elemento tiene atributos HTML , pero no contenido.<base>

Una versión de desarrollo de este elemento (como BASE) se menciona en Etiquetas HTML ; estandarizada en HTML 2.0 ; todavía vigente.

<basefont />(deprecated)

Especifica un tamaño de fuente, tipo de letra y color base para el documento. Se utiliza junto con elementos. Obsoleto; se recomienda usar hojas de estilo .<font>

Estandarizado en HTML 3.2 ; obsoleto en HTML 4.0 Transitional ; inválido en HTML 4.0 Strict .

La etiqueta <ISINDEX> se muestra en Netscape 3.0.

<isindex />(deprecated)

<isindex>Podría aparecer en el encabezado o en el cuerpo del documento, pero solo una vez en un documento. Mostraría un campo de texto que enviaría el único parámetro para ?stringfacilitar el análisis para los scripts CGI en lugar de enviar ?query=string. Ver Formularios .

<link />

Especifica enlaces a otros documentos, como enlaces anteriores y siguientes , o versiones alternativas. ^{[ 21 ]} Un uso común es enlazar a hojas de estilo externas , usando el formato, . ^[²²^] Un uso menos común, pero importante, es proporcionar sugerencias de navegación de manera consistente mediante el uso de microformatos . Se definen varias relaciones comunes, que pueden exponerse a los usuarios a través de la interfaz del navegador en lugar de directamente en la página web, como: . El elemento de un documento puede contener cualquier número de elementos. Este elemento tiene atributos HTML , pero no contenido.<linkrel="stylesheet"type="text/css"href="url"title="description_of_style"><linkrel="next"href="url"><head><link/>

LINKExistía en el borrador 1.2 de HTML para Internet y fue estandarizado en HTML 2.0 ; sigue vigente.

<meta />

Se puede utilizar para especificar metadatos adicionales sobre un documento, como su autor, fecha de publicación, fecha de caducidad, idioma, título de página, descripción de página, palabras clave u otra información no proporcionada a través de los demás elementos de encabezado y atributos HTML . Debido a su naturaleza genérica, los elementos especifican pares clave-valor asociativos . En general, un elemento meta transmite información oculta sobre el documento. Se pueden utilizar varias etiquetas meta, todas las cuales deben estar anidadas en el elemento head. El propósito específico de cada elemento está definido por sus atributos. Fuera de XHTML , a menudo se da sin la barra diagonal ( ), a pesar de ser un elemento vacío .<meta/><meta/><meta>

En una forma, los elementos pueden especificar encabezados HTTP que un servidor web debe enviar antes del contenido real. Por ejemplo, especifica que la página debe servirse con un encabezado HTTP llamado que tiene un valor .<meta/><metahttp-equiv="foo"content="bar"/>foobar

En su forma general, un elemento especifica atributos HTML asociados que describen aspectos de la página HTML. Para evitar posibles ambigüedades, se puede proporcionar un tercer atributo opcional, , para especificar un marco semántico que defina el significado de la clave y su valor. Por ejemplo, en el elemento se identifica como que contiene el elemento, con un valor de , del marco de descripción de recursos DC o Dublin Core .<meta/>namecontentscheme<metaname="foo"content="bar"scheme="DC"/><meta/>foobar

Estandarizado en HTML 2.0 ; sigue vigente.

<object>...</object>

Se utiliza para incluir objetos genéricos en el encabezado del documento. Aunque rara vez se usa dentro de un elemento, podría utilizarse para extraer datos externos y asociarlos al documento actual.<head>

Estandarizado en HTML 4.0 ; sigue vigente.

<script>...</script>

Puede funcionar como contenedor de instrucciones de script o enlazar a un script externo con el srcatributo opcional. ^{[ 23 ]} También se puede usar en el cuerpo del documento para generar dinámicamente contenido en bloque o en línea.

Estandarizado en HTML 3.2 ; sigue vigente.

<style>...</style>

Especifica un estilo CSS para el documento, generalmente en el formato . Puede actuar como contenedor de instrucciones de estilo o enlazar a hojas de estilo externas; por ejemplo, en CSS , con directivas del formato ^[²⁴^].<styletype="text/css">...</style>@import<style>@importurl;</style>

Estandarizado en HTML 3.2 ; sigue vigente.

<title>...</title>

Esta etiqueta define el título de un documento. Es obligatoria en todos los documentos HTML y XHTML . Los agentes de usuario pueden usar el título de diferentes maneras. Por ejemplo:

Los navegadores web suelen mostrarlo en la barra de título de la ventana cuando esta está abierta y (cuando corresponda) en la barra de tareas cuando la ventana está minimizada.
Puede convertirse en el nombre de archivo predeterminado al guardar la página.
Podemos usar el elemento <title> solo una vez en una página web, y cuando hagamos otra página, volveremos a usar otro elemento <title> con un título nuevo (no uses el mismo nombre para todas las etiquetas de título en el sitio web, puede ser un problema para los motores de búsqueda).
Los rastreadores web de los motores de búsqueda pueden prestar especial atención a las palabras utilizadas en el título.

El elemento no debe contener otros elementos, solo texto. Solo se permite un elemento por documento.<title><title>

Existía en las etiquetas HTML y se estandarizó en HTML 2.0 ; sigue vigente.

Elementos del cuerpo del documento

En los navegadores visuales, los elementos que se pueden mostrar se pueden renderizar como bloques o en línea . Si bien todos los elementos forman parte de la secuencia del documento, los elementos de bloque aparecen dentro de sus elementos padres:

como objetos rectangulares que no se cortan a través de las líneas;
con márgenes de bloque, ancho y propiedades de altura que se pueden configurar independientemente de los elementos circundantes.

Por el contrario, los elementos en línea se tratan como parte del flujo del texto del documento; no se les pueden establecer márgenes, ancho ni alto, y sí se producen saltos de línea.

Elementos de bloque

Los elementos de bloque, o elementos de nivel de bloque, tienen una estructura rectangular. Por defecto, estos elementos abarcan todo el ancho de su elemento padre, impidiendo que cualquier otro elemento ocupe el mismo espacio horizontal en el que se encuentran.

La estructura rectangular de un elemento de bloque se conoce a menudo como el modelo de caja CSS y está compuesta por varias partes. Cada elemento contiene lo siguiente:

El contenido de un elemento es el texto real (u otro tipo de contenido multimedia) que se coloca entre las etiquetas de apertura y cierre de dicho elemento.
El relleno de un elemento es el espacio que rodea su contenido, pero que aún forma parte del elemento. No se debe usar el relleno para crear espacio en blanco entre dos elementos. Cualquier estilo de fondo asignado al elemento, como una imagen o un color, será visible dentro del relleno. Aumentar el tamaño del relleno de un elemento incrementa el espacio que ocupará.
El borde de un elemento es su extremo absoluto y abarca todo su perímetro. El grosor del borde aumenta el tamaño del elemento.
El margen de un elemento es el espacio en blanco que lo rodea. El contenido, el relleno y el borde de cualquier otro elemento no podrán invadir esta área, a menos que se les imponga mediante una configuración CSS avanzada . En la mayoría de las DTD estándar , los márgenes izquierdo y derecho de diferentes elementos se separarán. Por otro lado, los márgenes superior e inferior de un elemento no se apilarán ni se mezclarán. Esto significa que el espacio en blanco entre estos elementos será igual al margen mayor entre ellos.

La sección anterior se refiere únicamente a la implementación detallada de la representación CSS y no tiene ninguna relación con los elementos HTML en sí mismos.

Texto básico

<p>...</p>: Crea un párrafo, quizás el elemento de bloque más común.; PExistía en las etiquetas HTML y se estandarizó en HTML 2.0 ; sigue vigente.
<h1>...</h1>
<h2>...</h2>
<h3>...</h3>
<h4>...</h4>
<h5>...</h5>
<h6>...</h6>: Encabezados de sección en diferentes niveles. h1delimita el encabezado de nivel más alto, h2el siguiente nivel inferior (subsección), h3para un nivel inferior a ese, y así sucesivamente hasta h6. A veces se les denomina colectivamente etiquetas, n significa cualquiera de los niveles de encabezado disponibles. La mayoría de los navegadores visuales muestran los encabezados como texto grande en negrita por defecto, aunque esto se puede anular con CSS . Los elementos de encabezado no están destinados simplemente a crear texto grande o en negrita; de hecho, no deben usarse para dar estilo explícito al texto. Más bien, describen la estructura y organización del documento. Algunos programas los usan para generar esquemas y tablas de contenido.hn; Los encabezados existían en las etiquetas HTML y se estandarizaron en HTML 2.0 ; siguen vigentes.

Liza

<dl>...</dl>

Una lista de descripción (también conocida como lista de asociación o lista de definición) consta de grupos nombre-valor, ^{[ 25 ]} y se conocía como lista de definición antes de HTML5. ^{[ 26 ]} Las listas de descripción están destinadas a grupos de "términos y definiciones, temas y valores de metadatos, preguntas y respuestas, o cualquier otro grupo de datos nombre-valor". ^{[ 27 ]}

DLExistía en las etiquetas HTML y se estandarizó en HTML 2.0 ; sigue vigente.

<dt>...</dt>

Un nombre en una lista de descripciones (anteriormente término de definición en una lista de definiciones).

DTExistía en las etiquetas HTML y se estandarizó en HTML 2.0 ; sigue vigente.

<dd>...</dd>

Un valor en una lista de descripción (anteriormente datos de definición en una lista de definición).

DDExistía en las etiquetas HTML y se estandarizó en HTML 2.0 ; sigue vigente.

<ol>...</ol>

Una lista ordenada (enumerada). El typeatributo se puede usar para especificar el tipo de marcador que se usará en la lista, pero las hojas de estilo ofrecen más control. El valor predeterminado es la numeración arábiga. En un atributo HTML: ; o en una declaración CSS: – reemplazando con uno de los siguientes: <oltype="foo">ol{list-style-type:foo;}foo

A, B, C ... – Valor HTML: A; Valor CSS:upper-alpha
a, b, c ... – Valor HTML: a; Valor CSS:lower-alpha
I, II, III ... – Valor HTML: I; Valor CSS:upper-roman
i, ii, iii ... – Valor HTML: i; Valor CSS:lower-roman
1, 2, 3 ... – Valor HTML: 1;decimal

CSS proporciona varias otras opciones no disponibles como marcado HTML puro, incluidas noneopciones para escritura CJK , hebreo, georgiano y armenio. El atributo está obsoleto en HTML 3.2 y 4.01, pero no en HTML 5.

OLExistía en el borrador 1.2 de HTML para Internet y fue estandarizado en HTML 2.0 ; sigue vigente.

<ul>...</ul>

Una lista desordenada (con viñetas). El tipo de marcador de elemento de lista se puede especificar en un atributo HTML: ; o en una declaración CSS: – reemplazando con uno de los siguientes (se usan los mismos valores en HTML y CSS): (el predeterminado), , o . Solo el método CSS es compatible en HTML5; el atributo está obsoleto en HTML 3.2 y 4.01. CSS también proporciona , y la capacidad de reemplazar estas viñetas con imágenes personalizadas.<ultype="foo">ul{list-style-type:foo;}foodiscsquarecirclenone

ULExistía en las etiquetas HTML y se estandarizó en HTML 2.0 ; sigue vigente.

<li>...</li>

Un elemento de lista en listas ordenadas ( ol) o no ordenadas ( ).ul

LIExistía en las etiquetas HTML y se estandarizó en HTML 2.0 ; sigue vigente.

<dir>...</dir>(deprecated)

Un listado de directorio. El propósito original de este elemento nunca fue ampliamente respaldado; obsoleto en favor de .<ul>

DIRExistía en las etiquetas HTML y se estandarizó en HTML 2.0 ; quedó obsoleto en HTML 4.0 Transitional ; no es válido en HTML 4.0 Strict .

Otros elementos de bloque

<address>...</address>: Información de contacto del autor del documento.; ADDRESSExistía en las etiquetas HTML y se estandarizó en HTML 2.0 ; sigue vigente.
<article>...</article>: Se utiliza para artículos y otros contenidos similares.; Estandarizado en HTML5 .
<aside>...</aside>: Se utiliza para el contenido de un documento que está separado del contenido principal de la página, por ejemplo, barras laterales o publicidad.; Estandarizado en HTML5 .
<blockquote>...</blockquote>: Elemento Blockquote: una cita de nivel de bloque ; define "una sección [dentro de un documento] que se cita de otra fuente". ^{[ 28 ]} El citeatributo (que no debe confundirse con el elemento) puede proporcionar la fuente y debe ser un identificador uniforme de recursos completamente calificado . La presentación predeterminada de las citas de bloque en los navegadores visuales suele ser sangrarlas desde ambos márgenes. Esto ha llevado a que el elemento se utilice innecesariamente solo para sangrar párrafos, independientemente de la semántica. Sin embargo, el uso no semántico del elemento puramente para sangrar texto ha sido desaprobado por el W3C ( World Wide Web Consortium ) desde HTML 4. ^[²⁹^] El enfoque preferido es el uso de CSS . Para citas que no contienen elementos de nivel de bloque, consulte el elemento quote ( ).<cite>blockquote<q>; BLOCKQUOTEExistía en el borrador 1.2 de HTML para Internet y fue estandarizado en HTML 2.0 ; sigue vigente.
<center>...</center>(deprecated): Crea una división centrada a nivel de bloque. Obsoleto; se recomienda usar otro elemento con centrado definido mediante hojas de estilo.<div>; Estandarizado en HTML 3.2 ; obsoleto en HTML 4.0 ; no compatible con HTML5 .
<del>...</del>: Marca una sección de contenido eliminada. Este elemento también se puede utilizar como en línea .; Estandarizado en HTML 4.0 ; sigue vigente.
<div>...</div>: Una división lógica a nivel de bloque. Un elemento genérico sin significado semántico que se utiliza para distinguir una sección del documento, generalmente con fines tales como la presentación o el comportamiento controlado por hojas de estilo o llamadas al DOM .; Propuesto en los borradores de HTML 3.0 ; estandarizado en HTML 3.2 ; aún vigente.
<figure>...</figure>: Se utiliza para agrupar imágenes y subtítulos, junto con .<figcaption>; Estandarizado en HTML5 .
<figcaption>...</figcaption>: Un pie de foto para una imagen. Siempre se coloca dentro del elemento.<figure>; Estandarizado en HTML5 .
<footer>...</footer>: Se utilizan para los pies de página de los documentos. Pueden contener información sobre el autor o los derechos de autor, o enlaces a otras páginas.; Estandarizado en HTML5 .
<header>...</header>: Se utilizan para los encabezados de los documentos. Estos suelen contener información que introduce la página.; Estandarizado en HTML5 .
<hr />: Una ruptura temática (originalmente: línea horizontal). Las reglas de presentación se pueden dibujar con hojas de estilo.; Estandarizado en HTML 2.0 ; sigue vigente.
<ins>...</ins>: Marca una sección de contenido insertado. Este elemento también se puede utilizar como en línea .; Estandarizado en HTML 4.0 ; sigue vigente.
<main>...</main>: Contiene el contenido principal de un documento.; Estandarizado en HTML 5.1 .
<menu>...</menu>: HTML 2.0: Un listado de menú. Debe ser más compacto que una lista.<ul>; MENUExistía en las etiquetas HTML y se estandarizó en HTML 2.0 ; quedó obsoleto en HTML 4.0 Transitional ; no era válido en HTML 4.0 Strict ; luego se redefinió en HTML5 , se eliminó en HTML 5.2, pero se incluyó en el HTML Living Standard en 2019.
<nav>...</nav>: Se utiliza en las secciones de navegación de los artículos (áreas de las páginas web que contienen enlaces a otras páginas web).; Estandarizado en HTML5 .
<noscript>...</noscript>: Contenido de reemplazo para scripts. A diferencia de los scripts , este solo se puede usar como un elemento de nivel de bloque.; Estandarizado en HTML 4.0 ; sigue vigente.
<pre>...</pre>: Texto preformateado . El texto dentro de este elemento se muestra normalmente en una fuente no proporcional exactamente como está dispuesto en el archivo (ver arte ASCII ). Mientras que los navegadores ignoran los espacios en blanco para otros elementos HTML, en , los espacios en blanco deben renderizarse como se escribieron. (Con las propiedades CSS: , otros elementos pueden presentarse de la misma manera). Este elemento puede contener cualquier elemento en línea excepto: , , , , , y .<pre>...</pre>{white-space:pre;font-family:monospace;}<image><object><big><small><sup><sub>...</sub>; PREExistía en el borrador 1.2 de HTML para Internet y fue estandarizado en HTML 2.0 ; sigue vigente.
<section>...</section>: Se utiliza para secciones genéricas de un documento. Esto difiere en que solo se utiliza para contener secciones de una página, que el W3C define como un grupo de contenido con un tema similar.<div>; Estandarizado en HTML5 .
<script>...</script>: Inserta un script en el documento. También se puede usar en la cabecera y en contextos en línea. Puede utilizarse con un atributo para proporcionar una URL desde la que cargar el script, o alrededor del contenido del script incrustado. Nota: no es un elemento de bloque ni en línea; por sí solo no debería mostrarse, pero puede contener instrucciones para generar dinámicamente contenido de bloque o en línea.<script/>src<script>...</script><script>; Estandarizado en HTML 3.2 ; sigue vigente.

Elementos en línea

Los elementos en línea no pueden colocarse directamente dentro del elemento; deben estar completamente anidados dentro de elementos de nivel de bloque. ^[³⁰^]<body>

Ancla

<a>...</a>

Un elemento de anclaje se denomina así porque los diseñadores web pueden usarlo para "anclar" una URL a un texto en una página web. Cuando los usuarios visualizan la página web en un navegador, pueden hacer clic en el texto para activar el enlace y visitar la página cuya URL se encuentra en dicho enlace. ^{[ 31 ]}

En HTML, un "ancla" puede ser el origen (el texto del ancla ) o el destino de un hipervínculo . Como origen, al establecer el atributo href[ ³²^] se crea un hipervínculo que puede apuntar a otra parte del documento o a otro recurso (por ejemplo, una página web) mediante una URL externa ^. Como destino, al establecer los atributos HTMLname o , se permite que el elemento se enlace desde un Localizador Uniforme de Recursos (URL) mediante un identificador de fragmento . Ambas formas, origen y ancla, pueden usarse simultáneamente.id

En HTML5, cualquier elemento ahora puede convertirse en un destino mediante el uso del idatributo, ^{[ 33 ]} por lo que no es necesario usarlo , aunque esta forma de agregar anclas sigue funcionando.<aname="foo">...</a>

Para ilustrar: el encabezado de una sección de tabla de contenido enejemplo.comLa página de inicio de podría convertirse en un objetivo escribiendo: . Ahora que la sección ha sido marcada como objetivo, se puede hacer referencia a ella desde sitios externos con un enlace como: ; o con un enlace en la misma página como: .<h2><aname="contents">Table of contents</a></h2><ahref="http://example.com#contents">see contents</a><ahref="#contents">contents, above</a>

El atributo titlepuede configurarse para proporcionar información breve sobre el enlace: .<ahref="URL"title="additional information">link text</a>

En la mayoría de los navegadores gráficos, cuando el cursor se sitúa sobre un enlace, este se transforma en una mano con el dedo índice extendido y el titlevalor se muestra en una información emergente o de alguna otra forma. Algunos navegadores muestran el texto alternativo de la misma manera, aunque esto no es lo que especifica el reglamento.

AExistía en las etiquetas HTML y se estandarizó en HTML 2.0 .

Elementos de la frase

Los elementos de frase se utilizan para marcar frases y añadir estructura o significado semántico a fragmentos de texto. Por ejemplo, las etiquetas y se pueden utilizar para añadir énfasis al texto.<em><strong>

General

<abbr>...</abbr>: Indica una abreviatura y puede mostrar la forma completa:<abbrtitle="abbreviation">abbr.</abbr>; Estandarizado en HTML 4.0 ; sigue vigente.
<acronym>...</acronym>(deprecated): Similar al elemento, pero marca un acrónimo :<abbr><acronymtitle="Hyper-Text Mark-up Language">HTML</acronym>; Estandarizado en HTML 4.0 ; aún vigente, no compatible con HTML5 . Se recomienda su reemplazo con la abbretiqueta. ^{[ 34 ]}
<dfn>...</dfn>: Definición en línea de un solo término.; DFNExistía en el borrador 1.2 de HTML para Internet y fue estandarizado completamente en HTML 3.2 ; sigue vigente.
<em>...</em>: Énfasis (generalmente se muestra en cursiva); EMExistía en el borrador 1.2 de HTML para Internet y fue estandarizado en HTML 2.0 ; sigue vigente.
<strong>...</strong>: Importancia ; énfasis original marcado (generalmente mostrado en negrita). Un agente de usuario auditivo puede usar diferentes voces para enfatizar.; STRONGExistía en el borrador 1.2 de HTML para Internet y se estandarizó en HTML 2.0 ; sigue vigente, redefinido en HTML5.

Elementos de frases informáticas

Estos elementos son útiles principalmente para documentar el desarrollo del código informático y la interacción del usuario mediante la diferenciación del código fuente ( ), las variables ( ), la entrada del usuario ( ) y la salida del terminal u otra ( ).<code><var><kbd><samp>

<code>...</code>: Un fragmento de código ( code example). Representado convencionalmente en una fuente monoespaciada.; CODEExistía en el borrador 1.2 de HTML para Internet y fue estandarizado en HTML 2.0 ; sigue vigente.
<kbd>...</kbd>: Teclado: texto que debe introducir el usuario ( kbd example).; KBDExistía en el borrador 1.2 de HTML para Internet y fue estandarizado en HTML 2.0 ; sigue vigente.
<samp>...</samp>: Ejemplo de salida – de un programa o script: (Ejemplo de muestra).; SAMPExistía en el borrador 1.2 de HTML para Internet y fue estandarizado en HTML 2.0 ; sigue vigente.
<var>...</var>: Variable ( ejemplo de variable ).; VARExistía en el borrador 1.2 de HTML para Internet y fue estandarizado en HTML 2.0 ; sigue vigente.

Presentación

Como el marcado de presentación visual solo se aplica directamente a los navegadores visuales, se desaconseja su uso. En su lugar, se deben usar hojas de estilo. Varios de estos elementos están obsoletos o no son válidos en HTML 4 / XHTML 1.0, y el resto no son válidos en el borrador actual de XHTML 2.0 . Sin embargo, el borrador actual de HTML5 reincorpora , , y , asignando un nuevo significado semántico a cada uno. En un documento HTML5 , el uso de estos elementos ya no se desaconseja, siempre que sea semánticamente correcto. <s><u><small>

<b>...</b>

En HTML 4 , establezca la fuente en negrita siempre que sea posible. CSS equivalente: . El elemento suele tener el mismo efecto en los navegadores visuales, además de tener un significado semántico más amplio, en HTML 4.01 . Sin embargo, en HTML5 , tiene su propio significado, distinto del de . Denota "texto al que se llama la atención con fines utilitarios sin transmitir ninguna importancia adicional y sin implicar una voz o un estado de ánimo alternativo". ^[³⁵^]{font-weight:bold;}<strong><b><strong>

BExistía en el borrador 1.2 de HTML para Internet y se estandarizó en HTML 2.0 ; sigue vigente, redefinido en HTML5.

<i>...</i>

En HTML 4 , configure la fuente en cursiva siempre que sea posible. CSS equivalente : . El uso de tiene el mismo efecto visual en la mayoría de los navegadores, además de tener un significado semántico como énfasis , en HTML 4.01 . (Las cursivas puramente tipográficas tienen muchos propósitos que no son de énfasis, como HTML 5 reconoció más explícitamente). En HTML5 , sin embargo, tiene su propio significado semántico, distinto del de . Denota "una calidad de texto diferente" o "una voz o estado de ánimo alternativo", por ejemplo, un pensamiento, el nombre de un barco, el nombre de una especie binaria , una frase en un idioma extranjero, etc. ^[³⁶^]{font-style:italic;}<em>...</em><i><em>

IExistía en el borrador 1.2 de HTML para Internet y se estandarizó en HTML 2.0 ; sigue vigente, redefinido en HTML5.

<u>...</u>

En HTML 4 , texto subrayado . CSS equivalente: . Obsoleto en HTML 4.01 . Restaurado en HTML5 . En HTML5 , el elemento denota "un segmento de texto con una anotación no textual no articulada, aunque explícitamente representada, como etiquetar el texto como un nombre propio en texto chino (una marca de nombre propio chino), o etiquetar el texto como mal escrito". La especificación HTML5 recuerda a los desarrolladores que otros elementos son casi siempre más apropiados que y advierte a los diseñadores que no utilicen texto subrayado donde pueda confundirse con un hipervínculo. ^[³⁷^]{text-decoration:underline;}<u><u>

UExistía en HTML Internet Draft 1.2 , se estandarizó en HTML 3.2 pero quedó obsoleto en HTML 4.0 Transitional y no era válido en HTML 4.0 Strict . Se reintrodujo en HTML5 .

<small>...</small>

En HTML 4 , tamaño de fuente reducido ( texto más pequeño ). CSS equivalente: En HTML5 , el elemento denota "comentarios laterales como letra pequeña". ^[³⁸^] Esto ha causado cierta confusión con el elemento.{font-size:smaller;}<small><aside>...</aside>

Estandarizado en HTML 3.2 ; sigue vigente.

<s>...</s>

En HTML 4 , indicaba texto tachado ( ~~Strikethrough~~ ) y era equivalente a . En HTML5 , el elemento denota información que "ya no es precisa o ya no es relevante", y no debe confundirse con , que indica eliminación/borrado. ^[³⁹^]<strike><s><del>

Sfue obsoleto en HTML 4.0 Transitional (al no haber aparecido en ningún estándar anterior) y era inválido en HTML 4.0 Strict . Reintroducido en HTML5 , que en su lugar lo declaró obsoleto .<strike>

<big>...</big>(deprecated)

Aumento del tamaño de la fuente ( texto más grande ). CSS equivalente:{font-size:larger;}

Estandarizado en HTML 3.2 ; no compatible con HTML5 .

<strike>...</strike>(deprecated)

Texto tachado ( ~~Tachado~~ ), (CSS equivalente: ){text-decoration:line-through;}

STRIKESe estandarizó en HTML 3.2 ; quedó obsoleto en HTML 4.0 Transitional ; no es válido en HTML 4.0 Strict .

<tt>...</tt>(deprecated)

Fuente de ancho fijo ( tipo máquina de escribir ), también conocida como teletipo , por lo tanto "tt". (CSS equivalente: ){font-family:monospace;}

TTExistía en el borrador de Internet HTML 1.2 y se estandarizó en HTML 2.0 ; no es compatible ^{[ 40 ]} en HTML5. Posibles reemplazos: para marcar la entrada del usuario, para variables (generalmente se muestra en cursiva y no con un cambio a monoespacio), para código fuente, para salida. ^[⁴⁰^]<kbd><var><code><samp>

<font>...</font>(deprecated)

<font[color=<var>color</var>] [size=<var>size</var>] [face=<var>face</var>]>...</font> Se puede especificar el color de la fuente con el coloratributo (nótese la ortografía estadounidense), el tipo de letra con el faceatributo y el tamaño absoluto o relativo con el sizeatributo. Ejemplos (todos los usos están obsoletos; utilice equivalentes CSS si es posible):

<fontcolor="green">text</font>crea texto verde .
<fontcolor="#114499">text</font>crea texto con color hexadecimal #114499 .
<fontsize="4">text</font>crea texto con tamaño 4. Los tamaños van del 1 al 7. El tamaño estándar es 3, a menos que se especifique lo contrario en la etiqueta < body> u otras etiquetas.
<fontsize="+1">text</font>crea texto con un tamaño 1 más grande que el estándar. es lo contrario.<fontsize="-1">text</font>
<fontface="Courier">text</font>crea texto con la fuente Courier.

CSS equivalente para los atributos de fuente:

<fontsize="N">corresponde a (la especificación HTML no define la relación entre el tamaño N y el tamaño unitario Y , ni define una unidad).{font-size:Yunits}
<fontcolor="red">corresponde a{color:red;}
<fontface="Times New Roman">corresponde a : CSS admite una pila de fuentes , de dos o más fuentes alternativas.{font-family:'Times New Roman',Times,serif;}

Estandarizado en HTML 3.2 ; obsoleto en HTML 4.0 Transitional ; inválido en HTML 4.0 Strict . No forma parte de HTML5.

Durar

<span>...</span>: Una división lógica en línea. Un elemento genérico sin significado semántico que se utiliza para distinguir una sección del documento, generalmente con fines tales como la presentación o el comportamiento controlado por hojas de estilo o llamadas al DOM .; Estandarizado en HTML 4.0 ; sigue vigente.

Otros elementos en línea

<br />: Un salto de línea. ^{[ 11 ]}^{: 48}; Estandarizado en HTML 2.0 ; sigue vigente.
<bdi>...</bdi>: Aísla una sección de texto en línea que puede estar formateada en una dirección diferente a la del resto del texto, como por ejemplo contenido generado por el usuario con direccionalidad desconocida.; Estandarizado en HTML5 .
<bdo>...</bdo>: Indica una sección de texto en línea cuya dirección de lectura es opuesta a la del elemento padre.; Estandarizado en HTML 4.0 ; sigue vigente.
<cite>...</cite>: Una cita o referencia para una frase o declaración en el documento.; La función CITE existía en el borrador 1.2 de HTML Internet Draft y se estandarizó en HTML 2.0 ; sigue vigente.; Nota: Las especificaciones de HTML 5 se han bifurcado de forma confusa , ^{[ 41 ]} incluso con respecto a este elemento. En HTML 4 y anteriores, era para "una cita o una referencia a otras fuentes" sin limitaciones ni requisitos particulares. ^[⁴²^] La especificación HTML 5 del W3C utiliza un refinamiento de esta idea, reflejando cómo se ha utilizado históricamente el elemento, pero ahora requiere que contenga (pero no se limite a) al menos uno de "el título de la obra o el nombre del autor (persona, personas u organización) o una referencia URL, o una referencia en forma abreviada según las convenciones utilizadas para la adición de metadatos de cita". ^[⁴³^] Pero la especificación WHATWG solo permite que el elemento se utilice alrededor del título de una obra. ^[⁴⁴^] Las especificaciones del W3C comenzaron con la definición más amplia, luego cambiaron a la muy restrictiva después de que WHATWG hiciera este cambio. Sin embargo, el W3C revirtió su propio cambio en 2012, en respuesta a los comentarios negativos de la comunidad de desarrolladores; El elemento se utilizaba ampliamente con un alcance más amplio, por ejemplo, varias plataformas de blogs y foros envuelven los ID y las direcciones de correo electrónico de los comentaristas en , y las personas que utilizaban el elemento para citas bibliográficas envolvían (y siguen envolviendo) de forma rutinaria cada cita completa en este elemento. <cite><cite>...</cite>
Otro problema con este elemento es que WHATWG recomienda que se muestre en cursiva por defecto (por lo que casi todos los navegadores lo hacen), ya que (en su opinión) solo se usa para títulos de publicaciones. Sin embargo, por convención, solo ciertos tipos de títulos llevan cursiva, mientras que otros deben ir entre comillas, y los estándares pueden variar según el contexto de publicación y el idioma. Por consiguiente, muchos autores y administradores de sitios web utilizan una hoja de estilos global para deshacer la cursiva automática de este elemento.
<data>...</data>: Incluye enlaces en el contenido con una traducción legible por máquina.; Estandarizado en HTML5 . ^{[ 45 ]}
<del>...</del>: Texto eliminado. Normalmente se muestra tachado :~~Texto eliminado.~~; Estandarizado en HTML 4.0 ; sigue vigente.
<ins>...</ins>: Texto insertado. Se usa a menudo para marcar texto de reemplazo para material tachado con o . Normalmente se muestra subrayado :<del><s>Texto insertado.; Estandarizado en HTML 4.0 ; sigue vigente.; Los elementos <p> y <p> también pueden usarse como elementos de bloque: conteniendo otros elementos de bloque y en línea. Sin embargo, estos elementos deben permanecer completamente dentro de su elemento padre para mantener un documento HTML bien formado. Por ejemplo, para eliminar texto desde la mitad de un párrafo a lo largo de varios otros párrafos y terminar en un párrafo final, se necesitarían tres elementos separados. Se requerirían dos elementos <p> como elementos en línea para indicar la eliminación de texto en el primer y último párrafo, y un tercero, usado como elemento de bloque, para indicar la eliminación en los párrafos intermedios.<ins><del><del><del>
<mark>...</mark>: Diseñado para resaltar o marcar el texto relevante en una cita:Texto resaltado; Estandarizado en HTML5 .
<q>...</q>: Una cita en línea (para citas a nivel de bloque, consulte ). Los elementos de cita pueden estar anidados. debería generar automáticamente comillas junto con las hojas de estilo. Problemas prácticos debido a la incompatibilidad del navegador pueden obligar a los autores a buscar soluciones alternativas. El atributo proporciona la fuente y debe ser una URI completamente calificada .<blockquote><q>cite; Estandarizado en HTML 4.0 ; sigue vigente.
<rb>...</rb>: Representa el componente base de una anotación ruby .; Estandarizado en HTML5 . ^{[ 46 ]}
<rp>...</rp>: Proporciona paréntesis como alternativa para los navegadores que no admiten anotaciones Ruby .; Estandarizado en HTML5 . ^{[ 47 ]}
<rt>...</rt>: Indica la pronunciación de un carácter en una anotación ruby .; Estandarizado en HTML5 . ^{[ 48 ]}
<rtc>...</rtc>: Anotaciones semánticas para una anotación ruby .; Estandarizado en HTML5 . ^{[ 49 ]}
<ruby>...</ruby>: Representa una anotación en rubí para mostrar la pronunciación de caracteres de Asia Oriental.; Estandarizado en HTML5 . ^{[ 50 ]}
<script>...</script>: Inserta un script en el documento. También se puede usar en la cabecera y en contextos de bloque. Nota: no es un elemento de bloque ni en línea; por sí solo no debería mostrarse, pero puede contener instrucciones para generar dinámicamente contenido de bloque o en línea.<script>; Estandarizado en HTML 3.2 ; sigue vigente.
<sub>...</sub>
<sup>...</sup>: Marcar texto _{en subíndice} o ^superíndice . (CSS equivalente: y , respectivamente).{vertical-align:sub;}{vertical-align:super;}; Ambas fueron propuestas en los borradores de HTML 3.0 ; estandarizadas en HTML 3.2 ; y siguen vigentes.
<template>...</template>: Fragmentos de código que serán copiados por los scripts.; Estandarizado en HTML5 . ^{[ 51 ]}
<time>...</time>: Representa una hora en formato de 24 horas o una fecha en el calendario gregoriano , con la opción de incluir información sobre la hora y la zona horaria. También permite representar la hora y la fecha en un formato legible por máquina.; Estandarizado en HTML5 . ^{[ 52 ]}
<wbr />: Un salto de palabra opcional.; Fue ampliamente utilizado (y compatible con los principales navegadores) ^{[ 53 ]} desde la década de 1990 ^{[ 54 ]} a pesar de no ser estándar hasta que finalmente se estandarizó en HTML5 . ^{[ 55 ]}

Imágenes y objetos

<applet>...</applet>(deprecated): Inserta un applet de Java en la página. Obsoleto en favor de , ya que solo se podía usar con applets de Java y tenía limitaciones de accesibilidad.<object>; Estandarizado en HTML 3.2 ; obsoleto en HTML 4.0 Transitional ; inválido en HTML 4.0 Strict ; obsoleto y completamente oculto en HTML5 .
<area />: Especifica un área enfocable en un .<map>; Estandarizado en HTML 3.2 ; sigue vigente.
<audio>...</audio>: Agrega audio HTML reproducible a la página. La URL del audio se determina mediante el srcatributo. Los formatos de audio compatibles varían según el navegador.; Estandarizado en HTML5 .
<canvas>...</canvas>: Agrega un lienzo cuyo contenido se puede editar con JavaScript . Se usa frecuentemente en juegos en línea.; Estandarizado en HTML5 .
<embed>...</embed>: Inserta un objeto no estándar (como un applet) o contenido externo (normalmente no HTML) en el documento.; Obsoleto en HTML 4 a favor de , pero luego se volvió a agregar a la especificación HTML5 ^[⁵⁶^]^[⁵⁷^]<object>
<img />: Utilizado por agentes de usuario visuales para insertar una imagen en el documento. El srcatributo especifica la URL de la imagen. El altatributo requerido proporciona texto alternativo en caso de que la imagen no pueda mostrarse. ^{[ 58 ]} (Aunque altestá pensado como texto alternativo, Microsoft Internet Explorer 7 y versiones anteriores lo muestran como una información sobre herramientas si no titlese proporciona ningún atributo. ^{[ 59 ]} Safari y Google Chrome , por otro lado, no muestran el atributo alt en absoluto.) ^{[ 60 ]} El elemento fue propuesto por primera vez por Marc Andreessen e implementado en el navegador web NCSA Mosaic . ^[⁶¹^]<img/>; IMGExistía en el borrador 1.2 de HTML para Internet y fue estandarizado en HTML 2.0 ; sigue vigente.
<map>...</map>: Especifica un mapa de imágenes del lado del cliente .; Estandarizado en HTML 3.2 ; sigue vigente.
<object>...</object>: Incluye un objeto en la página del tipo especificado por el typeatributo. Puede ser de cualquier tipo MIME que el agente de usuario entienda, como una página HTML incrustada, un archivo que será procesado por un complemento como Flash , un applet de Java , un archivo de sonido, etc.; Estandarizado en HTML 4.0 ; sigue vigente.
<param />: Originalmente introducido con , este elemento ahora se usa con , y solo debe aparecer como hijo de . Utiliza atributos HTML para establecer un parámetro para el objeto, por ejemplo, ancho, alto, fuente, color de fondo, etc., dependiendo del tipo de objeto. Un objeto puede tener múltiples elementos.<applet><object><object><param/>; Estandarizado en HTML 3.2 ; sigue vigente.
<source>...</source>: Especifica diferentes fuentes para audio o vídeo. Utiliza el srcatributo de forma similar a los elementos y .<video><audio>; Estandarizado en HTML5 .
<track>...</track>: Proporciona pistas de texto, como subtítulos y leyendas, para audio y vídeo.; Estandarizado en HTML5 .
<video>...</video>: Agrega un video HTML reproducible a la página. La URL del video se determina mediante el srcatributo. Los formatos de video compatibles varían según el navegador.; Estandarizado en HTML5 .

Formularios

Estos elementos pueden combinarse en un formulario o, en algunos casos, utilizarse por separado como controles de interfaz de usuario. En el documento, pueden ser HTML simple o usarse junto con scripts. El marcado HTML especifica los elementos que componen un formulario y el método para enviarlo. Sin embargo, una vez enviado, se debe utilizar algún tipo de script ( del servidor , del cliente o ambos) para procesar la información ingresada por el usuario.

(Estos elementos son elementos de bloque o en línea, pero se agrupan aquí porque su uso es más restringido que el de otros elementos en línea o de bloque).

<form action="url">...</form>

Crea un formulario . El elemento especifica y controla la acción general de un área de formulario, utilizando el atributo required.<form>action

Estandarizado en HTML 2.0 ; sigue vigente.

<button>...</button>

Un botón de formulario genérico que puede contener una variedad de otros elementos para crear botones complejos.

Estandarizado en HTML 4.0 ; sigue vigente.

<datalist>...</datalist>

Una lista de optionelementos para usar en formularios.

Estandarizado en HTML5 .

<fieldset>...</fieldset>

Un contenedor para agregar estructura a los formularios. Por ejemplo, una serie de controles relacionados se pueden agrupar dentro de un , al que luego se le puede agregar un para identificar su función.<fieldset><legend>

Estandarizado en HTML 4.0 ; sigue vigente.

<input />

<input>Estos elementos permiten implementar una variedad de controles de formulario estándar.

Estandarizado en HTML 2.0 ; sigue vigente.

Tipos de entrada:

tipo ="casilla de verificación": Una casilla de verificación . Puede estar marcada o desmarcada.
tipo "radio": Un botón de opción . Si varios botones de opción tienen el mismo nombre, el usuario solo podrá seleccionar uno de ellos de este grupo.
tipo "botón": Un botón de uso general. Se prefiere este elemento siempre que sea posible (es decir, si el cliente lo admite), ya que ofrece mayores posibilidades.<button>
tipo ="enviar": Un botón de enviar .
tipo "imagen": Un botón de imagen . La URL de la imagen se puede especificar con el srcatributo.
tipo ="reset": Un botón de reinicio para restablecer el formulario a sus valores predeterminados.
tipo ="texto": Un campo de entrada de texto de una sola línea . El sizeatributo especifica el ancho predeterminado de la entrada en anchos de caracteres. max-lengthEstablece el número máximo de caracteres que el usuario puede ingresar (que puede ser mayor que el tamaño).
tipo ="buscar": Una variante de la textcual produce una barra de búsqueda.
tipo ="contraseña": Una variante de text. La diferencia radica en que el texto introducido en este campo se muestra enmascarado : los caracteres se representan como un asterisco, un punto u otro símbolo. La contraseña se sigue enviando al servidor en texto plano , por lo que se requiere un protocolo de comunicación seguro subyacente como HTTPS si la confidencialidad es una preocupación.
tipo ="archivo": Un campo de selección de archivos (para subir archivos a un servidor).
tipo "tel": Una variación de textpara números de teléfono .
escribir "correo electrónico": Una variación de textpara direcciones de correo electrónico .
tipo ="url": Una variación de textpara URL .
tipo "fecha": Un selector de fechas.
tipo ="tiempo": Un selector de tiempo.
tipo ="número": Una variación de textpara números.
tipo ="rango": Genera un control deslizante que devuelve un número, pero dicho número no es visible para el usuario.
tipo "color": Un selector de color.
tipo ="oculto": hiddenLos campos de entrada no son visibles en la página renderizada, pero permiten al diseñador mantener una copia de los datos que deben enviarse al servidor como parte del formulario. Por ejemplo, pueden ser datos que el usuario introdujo o seleccionó en un formulario anterior y que deben procesarse junto con el formulario actual. Aunque no se muestran al usuario, los datos pueden modificarse en el lado del cliente editando el código HTML.

<isindex />(deprecated)

<isindex/>podía aparecer en el encabezado o en el cuerpo del documento, pero solo una vez en un documento. funcionaba como un formulario de búsqueda HTML primitivo; pero quedó obsoleto de facto por formularios HTML más avanzados introducidos a principios y mediados de la década de 1990. Representa un conjunto de hipervínculos compuestos por una URI base, un signo de ampersand y palabras clave codificadas en porcentaje separadas por signos más .<isindex/>

ISINDEXExistía en las etiquetas HTML ; estandarizado en HTML 2.0 ; obsoleto en HTML 4.0 Transitional ; inválido en HTML 4.0 Strict .

<keygen>...</keygen>(deprecated)

Un generador de pares de claves.

Estandarizado en HTML5 , pero eliminado en HTML 5.2.

<label for="id">...</label>

Crea una etiqueta para un campo de formulario, como por ejemplo radio. Al hacer clic en la etiqueta, se activa un clic en el campo correspondiente.

Estandarizado en HTML 4.0 ; sigue vigente.

<legend>...</legend>

Una leyenda (pie de foto) para un .<fieldset>

Estandarizado en HTML 4.0 ; sigue vigente.

<meter>...</meter>

Un medidor que necesita un valueatributo. También puede tener: min, low, high, y max.

Estandarizado en HTML5 .

<option value="x">...</option>

Crea un elemento en una lista.<select>

Estandarizado en HTML 2.0 ; sigue vigente.

<optgroup>...</optgroup>

Identifica un grupo de elementos en una lista.<option><select>

Estandarizado en HTML 4.0 ; sigue vigente.

<output>...</output>

El valor de un elemento de formulario.

Estandarizado en HTML5 .

<progress>...</progress>

Una barra para mostrar el progreso de una acción.

Estandarizado en HTML5 .

<select name="xyz">...</select>

Crea una lista de selección, de la cual el usuario puede elegir una sola opción. Puede mostrarse como una lista desplegable.

Estandarizado en HTML 2.0 ; sigue vigente.

<textarea rows="8">...</textarea>

Un área de texto de varias líneas, cuyo tamaño se especifica mediante cols(donde una columna tiene un ancho de un carácter) y rowsatributos HTML . El contenido de este elemento se limita a texto plano, que aparece en el área de texto como texto predeterminado al cargar la página.

Estandarizado en HTML 2.0 ; sigue vigente.

Tablas

El formato de las tablas HTML se propuso en los borradores de HTML 3.0 y posteriormente en el RFC 1942 sobre tablas HTML . Se inspiraron en el modelo de tabla CALS . Algunos elementos de estas propuestas se incluyeron en HTML 3.2; la forma actual de las tablas HTML se estandarizó en HTML 4. (Muchos de los elementos utilizados en las tablas no son ni elementos de bloque ni elementos en línea ).

<table>...</table>: Identifica una tabla. En HTML Transitional se pueden usar varios atributos HTML , pero la mayoría no son válidos en HTML Strict y se pueden reemplazar con hojas de estilo. El summaryatributo es informalmente necesario para fines de accesibilidad, aunque su uso no es sencillo.; Propuesto en los borradores de HTML 3.0 ; estandarizado en HTML 3.2 ; aún vigente.
<tr>...</tr>: Contiene una fila de celdas en un .<table>; Propuesto en los borradores de HTML 3.0 ; estandarizado en HTML 3.2 ; aún vigente.
<th>...</th>: Una celda de encabezado; el contenido se muestra convencionalmente en negrita y centrado. Un agente de usuario auditivo puede usar un tono de voz más alto para estos elementos.<table>; Propuesto en los borradores de HTML 3.0 ; estandarizado en HTML 3.2 ; aún vigente.
<td>...</td>: Una celda de datos.<table>; Propuesto en los borradores de HTML 3.0 ; estandarizado en HTML 3.2 ; aún vigente.
<colgroup>...</colgroup>: Especifica un grupo de columnas en un .<table>; Propuesto en tablas HTML ; estandarizado en HTML 4.0 ; aún vigente.
<col>...</col>: Especifica una columna en un .<table>; Propuesto en tablas HTML ; estandarizado en HTML 4.0 ; aún vigente.
<caption>...</caption>: Especifica un título para un .<table>; Propuesto en los borradores de HTML 3.0 ; estandarizado en HTML 3.2 ; aún vigente.
<thead>...</thead>: Especifica la parte del encabezado de una tabla . Esta sección puede ser repetida por el agente de usuario si la tabla se divide en varias páginas (en impresión u otros medios paginados).<table>; Propuesto en tablas HTML ; estandarizado en HTML 4.0 ; aún vigente.
<tbody>...</tbody>: Especifica un conjunto de datos para un .<table>; Propuesto en tablas HTML ; estandarizado en HTML 4.0 ; aún vigente.
<tfoot>...</tfoot>: Especifica la parte del pie de página de una tabla . Al igual que , esta sección puede ser repetida por el agente de usuario si la tabla se divide en varias páginas (en impresión u otros medios paginados).<table><thead>; Propuesto en tablas HTML ; estandarizado en HTML 4.0 ; aún vigente.

Marcos

Los marcos permiten dividir una ventana visual del navegador HTML en segmentos, cada uno de los cuales puede mostrar un documento diferente. Esto puede reducir el uso de ancho de banda, ya que se pueden usar partes repetitivas de un diseño en un marco, mientras que el contenido variable se muestra en otro. Esto puede tener un cierto costo de usabilidad, especialmente en agentes de usuario no visuales, ^{[ 62 ]} debido a que documentos (o sitios web) separados e independientes se muestran uno al lado del otro y se les permite interactuar con la misma ventana principal. Debido a este costo, los marcos (excluyendo el elemento) solo están permitidos en el conjunto de marcos de HTML 4.01. Los iframes también pueden contener documentos en diferentes servidores. En este caso, la interacción entre ventanas es bloqueada por el navegador. Sitios como Facebook y Twitter usan iframes para mostrar contenido ( plugins ) en sitios web de terceros. Google AdSense usa iframes para mostrar banners en sitios web de terceros.<iframe>

En HTML 4.01, un documento puede contener un y un o un y un , pero no ambos a la vez . Sin embargo, se puede usar en el cuerpo normal del documento.<head><body><head><frameset><body><frameset><iframe>

<frameset>...</frameset>(deprecated): Contiene el conjunto de elementos para un documento. La disposición de los marcos viene dada por listas separadas por comas en los atributos HTML y .<frame/>rowscols; Estandarizado en HTML 4.0 Frameset, obsoleto en HTML5.
<frame />(deprecated): Define un único marco o región dentro del . Un documento separado se vincula a un marco mediante el atributo dentro del elemento.<frameset>src<frame/>; Estandarizado en HTML 4.0 Frameset, obsoleto en HTML5.
<noframes>...</noframes>(deprecated): Contiene contenido HTML normal para agentes de usuario que no admiten elementos.<frame/>; Estandarizado en HTML 4.0 Transitional, obsoleto en HTML5.
<iframe>...</iframe>: Un marco en línea coloca otro documento HTML dentro de un marco. A diferencia de un elemento, un marco puede ser el marco de destino para los enlaces definidos por otros elementos, y el agente de usuario puede seleccionarlo como foco para imprimir, ver su código fuente, etc. El contenido del elemento se utiliza como texto alternativo que se mostrará si el navegador no admite marcos en línea. Un documento separado se vincula a un marco mediante el atributo dentro del elemento , y un código HTML en línea se inserta en un marco mediante el atributo dentro del elemento.<object/><iframe>src<iframe/>srcdoc<iframe/>; Introducido por primera vez por Microsoft Internet Explorer en 1997, estandarizado en HTML 4.0 Transitional y permitido en HTML5.

`longdesc`atributo

En HTML , longdesces un atributo utilizado dentro de los elementos , , o . Se supone que es una URL ^[^{nota 5}^] a un documento que proporciona una descripción larga para la imagen, marco o iframe en cuestión. ^[⁶³^] Este atributo debe contener una URL, no –como se suele creer erróneamente– el texto de la descripción en sí.<img/><frame/><iframe>

longdescfue diseñado para ser utilizado por lectores de pantalla para mostrar información de imágenes a usuarios de computadoras con problemas de accesibilidad , como personas ciegas o con discapacidad visual , y es ampliamente implementado tanto por navegadores web como por lectores de pantalla. ^{[ 64 ]} Algunos desarrolladores objetan que ^{[ 65 ]} en realidad rara vez se usa para este propósito porque hay relativamente pocos autores que usan el atributo y la mayoría de esos autores lo usan incorrectamente; por lo tanto, recomiendan desaprobarlo longdesc. ^{[ 66 ]} La industria editorial ha respondido, abogando por el mantenimiento de longdesc. ^{[ 67 ]}

Ejemplo

< img src = "Hello.jpg" longdesc = "description.html" >

Contenido de description.html:

<br /> <p> Esta es una imagen de un pastel de cumpleaños de dos pisos . </p> ...

[ 1 ]

[ 2 ]

[ 3 ]

[ 5 ]

[ 6 ]

[ nota 1 ]

[

[ nota 2 ]

[ nota 3 ]

[ 9 ]

[ nota 4 ]

[

[ 11 ]

[ 12 ]

[ 13 ]

[ 14 ]

[

[ 16 ]

[ 17 ]

[ 18 ]

[

[

[ 21 ]

[

[ 23 ]

[

[ 25 ]

[ 26 ]

[ 27 ]

[ 28 ]

[

[

[ 31 ]

32

[ 33 ]

[ 34 ]

[

[

[

[

[

[ 40 ]

[ 41 ]

[

[

[

[ 45 ]

[ 46 ]

[ 47 ]

[ 48 ]

[ 49 ]

[ 50 ]

[ 51 ]

[ 52 ]

[ 53 ]

[ 54 ]

[ 55 ]

[

[

[ 58 ]

[ 59 ]

[ 60 ]

[

[ 62 ]

[

[

[ 64 ]

[ 65 ]

[ 66 ]

[ 67 ]

Conceptos

Elementos vs. etiquetas

SGML frente a XML

%block;vs. caja

Descripción general

Sintaxis

Tipos de elementos

Atributos

Estándares de elementos

Estado del elemento

Contenido frente a presentación y comportamiento

Elementos de la estructura del documento

Elementos de encabezado del documento

Elementos del cuerpo del documento

Elementos de bloque

Texto básico

Liza

Otros elementos de bloque

Elementos en línea

Ancla

Elementos de la frase

General

Elementos de frases informáticas

Presentación

Durar

Otros elementos en línea

Imágenes y objetos

Formularios

Tablas

Marcos

longdescatributo

Ejemplo

Articulos relacionados

`%block;`vs. caja

`longdesc`atributo