Etiquetas y Atributos
La construcción de contenido en HTML se basa en el uso de etiquetas y atributos.
Etiquetas (Tags)
Las etiquetas son las palabras clave, rodeadas de corchetes angulares (< y >), que envuelven el contenido para decirle al navegador cómo interpretarlo.
La mayoría de los elementos HTML constan de dos etiquetas:
- Etiqueta de apertura:
<nombre>(ej.<p>) - Etiqueta de cierre:
</nombre>(ej.</p>)
El contenido se coloca entre ambas.
Ejemplo:
<p>Este es un párrafo de texto.</p>
Algunas etiquetas son "vacías" o "autocerradas", lo que significa que no contienen texto y no requieren una etiqueta de cierre. Sus atributos son suficientes para definir su comportamiento e información.
Ejemplos de etiquetas vacías:
<br>(Salto de línea)<hr>(Línea horizontal)<img>(Imagen)
Atributos (Attributes)
Los atributos proporcionan información adicional sobre los elementos HTML. Se definen siempre dentro de la etiqueta de apertura.
Los atributos suelen venir en pares de nombre="valor".
Ejemplo: El elemento imagen requiere dos atributos principales para funcionar correctamente:
<img src="logo.png" alt="Logotipo de la empresa">
src(source/origen): Indica al navegador dónde encontrar el archivo de imagen.alt(texto alternativo): Muestra un texto si la imagen no se carga, y es crucial para la accesibilidad y el SEO.
Atributos Globales: Algunos atributos se pueden aplicar a casi cualquier etiqueta:
id: Un identificador único en toda la página para ese elemento específico.class: Asigna el elemento a una o más "clases" para aplicarle estilos CSS o seleccionarlo con JavaScript.style: Permite añadir estilos CSS directamente en la etiqueta (no recomendado en la mayoría de los casos).