Atributos

Las etiquetas solas describen qué es el contenido. Los atributos les agregan información extra: configuran cómo se comporta el elemento, cómo se identifica, o qué recurso usa.

Los atributos van dentro de la etiqueta de apertura, después del nombre del elemento y separados por un espacio.

Sintaxis: nombre="valor"

<!-- Un enlace: href dice a dónde va el link -->
<a href="https://example.com">Visitá el sitio</a>

<!-- Una imagen: src dice qué imagen mostrar -->
<img src="foto.jpg" alt="Una descripción de la foto" />

Sin el atributo href, el <a> sería texto plano — no habría adónde ir. Sin src, el <img> no sabría qué imagen mostrar. Los atributos son lo que hace útiles a muchos elementos.

Un elemento puede tener varios atributos, separados por espacio dentro de la misma etiqueta de apertura:

<a href="https://example.com"
   target="_blank">Abrir en nueva pestaña</a>

Aquí href define el destino y target="_blank" le dice al navegador que abra el link en una pestaña nueva. El orden de los atributos no importa.

Atributos booleanos

Algunos atributos no tienen valor — su sola presencia activa una opción:

<input type="text" disabled />

disabled no tiene ="valor" porque basta con escribirlo para que el campo quede deshabilitado. Si no está, el campo funciona normal.

---

Void elements

Los void elements son elementos que no tienen contenido ni etiqueta de cierre. No pueden envolver texto — su función es insertar o incrustar algo.

<!-- Imagen -->
<img src="foto.jpg" alt="Una foto de ejemplo" />

<!-- Salto de línea -->
<br />

<!-- Línea horizontal -->
<hr />

Los void elements más comunes son: <img>, <br>, <hr> e <input>.

<img> necesita atributos para hacer algo útil: src dice qué imagen mostrar, alt dice qué es para quien no puede verla. Sin atributos, <img> no sabe qué imagen mostrar.

---

Tu turno: completá el <img> del starter con los atributos src y alt. Hacé clic en “Comprobar”.