El atributo `box-shadow` de CSS te permite aplicar una sombra paralela a un elemento. El atributo toma valores para el desplazamiento horizontal y vertical de la sombra, el desenfoque de la sombra, el tamaño de la sombra y el color de la sombra.
Aquí hay un ejemplo de cómo puedes usarlo:
```css
elemento {
box-shadow: 10px 10px 5px grey;
}
```
En este ejemplo:
- `10px` es el desplazamiento horizontal de la sombra. Un valor positivo empuja la sombra a la derecha y un valor negativo lo empuja a la izquierda.
- `10px` es el desplazamiento vertical de la sombra. Un valor positivo empuja la sombra hacia abajo y un valor negativo la empuja hacia arriba.
- `5px` es el radio de desenfoque de la sombra. Cuanto mayor sea el número, más borrosa será la sombra.
- `grey` es el color de la sombra.
También puedes especificar un cuarto valor para `box-shadow` para controlar el tamaño de la sombra. Este es un valor opcional y se coloca antes del color de la sombra. Un número positivo hará que la sombra sea más grande y un número negativo hará que la sombra sea más pequeña.
```css
elemento {
box-shadow: 10px 10px 5px 2px grey;
}
```
En este ejemplo, `2px` hará que la sombra sea 2px más grande.
Te recordamos que el efecto de sombra paralela se genera cuando los valores de desplazamiento horizontal y vertical son iguales, generando un efecto de sombra “equidistante” en relación al objeto.
