Logo CSS3

Sombras (box-shadow y text-shadow)

CSS3 introduce la posibilidad de añadir sombras a elementos y textos, lo que aporta profundidad y dimensión al diseño.Es muy útil para cuando creas una caja (card )que tiene el mismo color de fondo que el body, para resaltar los bordes o simplemente para mejorar UI.

El primer valor correponde a horizontal, el segundo a vertical, el tercero a difuminar y el último es el color que quieres usar, teniendo en cuenta que el último valor del rgba, es opacidad.

Aparte de hacerlo para cajas (cards), también se puede hacer con texto.

				
					.caja {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}


.texto {
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

				
			

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *