Los elementos en HTML se utilizan para dar es­tru­c­tu­ra a un documento HTML. Informan al navegador sobre cómo tratar los co­n­te­ni­dos incluidos.

¿Qué es un HTML-Element?

Un elemento en HTML es un co­m­po­ne­n­te dentro de un documento HTML que muestra al navegador cómo debe manejarse un contenido. No­r­ma­l­me­n­te comienza con una etiqueta de apertura <> y finaliza con una etiqueta de cierre </>. Entre ambas etiquetas se encuentra el contenido o el ámbito de validez. La etiqueta de apertura da una in­s­tru­c­ción sobre cómo tratar el contenido, y la etiqueta de cierre finaliza dicha in­s­tru­c­ción. Los elementos en HTML se utilizan para el formato, las pa­r­ti­cu­la­ri­da­des se­má­n­ti­cas y la simple re­pre­se­n­ta­ción de co­n­te­ni­dos.

Hosting
Hosting de primera al mejor precio
  • 3x más rápido, ahora un 60 % de ahorro
  • Alta di­s­po­ni­bi­li­dad >99.99 %
  • Solo en IONOS: hasta 500 GB incluidos

La sintaxis de un elemento HTML

La es­tru­c­tu­ra básica de un elemento en HTML casi siempre es la misma. La sintaxis es la siguiente:

<tagname>Aquí va el contenido o ámbito de validez</tagname>
html

La etiqueta de apertura <tagname> indica de qué tipo de elemento se trata. A co­n­ti­nua­ción, va el contenido o el ámbito de validez, y después la etiqueta de cierre </tagname>, que finaliza la in­s­tru­c­ción.

HTML-Element vs. HTML-Tag: ¿en qué se di­fe­re­n­cian?

Las etiquetas HTML son una parte fu­n­da­me­n­tal de los elementos en HTML. Una etiqueta de apertura marca el inicio de un elemento, y una etiqueta de cierre marca su final. Junto con el contenido, forman un elemento en HTML completo.

Ejemplo de HTML-Element

En el siguiente ejemplo sencillo se muestra el fu­n­cio­na­mie­n­to de un HTML-Element. También se ilustra el uso de un elemento en HTML anidado adicional. Todo documento HTML utiliza esta anidación para crear una es­tru­c­tu­ra je­rá­r­qui­ca. En el siguiente código, se usan cuatro elementos en HTML di­fe­re­n­tes: <html>, <[body](t3://page?uid=36866)>, <h1> y <p>:

<!DOCTYPE html>
<html>
<body>
<h1>Esto es un título</h1>
<p>Aquí va un párrafo.</p>
</body>
</html>
html

El elemento <html> define todo el documento como un documento HTML. Todos los demás co­n­te­ni­dos están dentro de este elemento. A co­n­ti­nua­ción, sigue el elemento <body>, que contiene el contenido visible del documento. Dentro de este elemento se en­cue­n­tran los elementos HTML <h1> y <p>. <h1> le indica al navegador que in­te­r­pre­te el contenido como un título HTML del nivel más alto de la jerarquía. El elemento <p> introduce un apartado de contenido.

Pa­r­ti­cu­la­ri­dad: elementos HTML vacíos

Existen algunos elementos en HTML que no necesitan contenido ni una etiqueta de cierre. Un ejemplo es el salto de línea HTML <br>. Este se inicia solo con una etiqueta de apertura, pero aun así se considera un HTML-Element. En el siguiente ejemplo puedes ver cómo se utiliza dentro de otro elemento HTML:

<!DOCTYPE html>
<html>
<body>
<p>Este es un párrafo <br>
    con un salto de línea.</p>
</body>
</html>
html

Los elementos HTML más im­po­r­ta­n­tes

Al trabajar con do­cu­me­n­tos HTML, ne­ce­si­ta­rás usar numerosos elementos en HTML. Aquí te mostramos algunos de los más im­po­r­ta­n­tes:

HTML-Element De­s­cri­p­ción
<html> Define HTML como el tipo de documento
<head> Marca in­fo­r­ma­ción que no se mostrará en el navegador
<title> Define el título de la página en el meta-title
<base> Establece la URL base
<body> Contiene todo el contenido visible en el navegador
<h1>, <h2>, <h3>, … Definen los títulos
<p> Marca un apartado de contenido
<ul> Inicia una lista des­or­de­na­da
<ol> Define una lista numerada
Consejo

¿Quieres saber más sobre el popular lenguaje de marcado para la web? En nuestro tutorial de HTML para pri­n­ci­pia­n­tes, hemos reunido los consejos y trucos más im­po­r­ta­n­tes para que empieces.

Ir al menú principal