La etiqueta HTML (abreviatura de "span element") es un elemento en línea genérico que se utiliza para agrupar secciones de texto con fines de estilo o para agregar atributos a una sección de texto sin crear una nueva línea de contenido.

A diferencia de otras etiquetas de bloque como o , la etiqueta no introduce un salto de línea, sino que se inserta dentro del flujo normal del texto.

Margin: Espaciado externo

El margin se refiere al espacio que rodea un elemento HTML por fuera de sus bordes. Este espacio crea un vacío entre el elemento y otros elementos adyacentes o los bordes de la página.

Se utiliza principalmente para:

Separar elementos: El margin permite crear espacio entre diferentes secciones de contenido, evitando que se peguen entre sí y mejorando la legibilidad. Ajustar la posición: El margin puede usarse para ajustar la posición de un elemento en relación con otros elementos o los bordes de la página. Crear diseños con rejillas: El margin es esencial para crear diseños en cuadrícula, donde los elementos se alinean y distribuyen de manera organizada.

Propiedades CSS para margin:

margin-top: Establece el espacio superior del elemento.

margin-right: Establece el espacio a la derecha del elemento.

margin-bottom: Establece el espacio inferior del elemento.

margin-left: Establece el espacio a la izquierda del elemento.

margin: Permite establecer un valor único para todos los márgenes

(arriba, derecha, abajo, izquierda).

---

Padding: Espaciado interno

El padding se refiere al espacio que existe entre el borde de un elemento HTML y su contenido. Este espacio crea un "relleno" alrededor del contenido dentro del elemento.

Se utiliza principalmente para:

Añadir espacio entre el contenido y el borde: El padding permite crear un espacio entre el borde del elemento y su contenido, evitando que el texto o las imágenes se peguen al borde.

Controlar el tamaño del elemento: El padding puede usarse para aumentar el tamaño total de un elemento, incluyendo el espacio alrededor del contenido.

Crear efectos visuales: El padding puede utilizarse para crear bordes internos, áreas resaltadas o efectos de diseño específicos.

Propiedades CSS para padding:

padding-top: Establece el espacio superior del contenido dentro del elemento.

padding-right: Establece el espacio a la derecha del contenido dentro del elemento.

padding-bottom: Establece el espacio inferior del contenido dentro del elemento.

padding-left: Establece el espacio a la izquierda del contenido dentro del elemento.

padding: Permite establecer un valor único para todo el padding (arriba, derecha, abajo, izquierda).