CSS-egenskapen `box-shadow` legger til skyggeeffekter rundt et element. Dette kan brukes til å legge til dybde og dimensjon til et element, eller for å få det til å skille seg ut fra resten av innholdet på en side.
"Box-shadow"-egenskapen tar opptil fire verdier, som spesifiserer forskyvning, uskarphet og spredning av skyggen, og fargen på skyggen.
1. Offset :Forskyvningsverdiene spesifiserer den horisontale og vertikale avstanden til skyggen fra elementet. Positive verdier flytter skyggen til høyre og ned, mens negative verdier flytter skyggen til venstre og opp.
2. Uskarp :Uskarphet-verdien angir mengden uskarphet som brukes på skyggen. En høyere uskarphet verdi vil skape en mykere skygge, mens en lavere uskarphet verdi vil skape en skarpere skygge.
3. Spredning :Spredningsverdien spesifiserer mengden spredning som brukes på skyggen. En høyere spredningsverdi vil skape en bredere skygge, mens en lavere spredningsverdi vil skape en smalere skygge.
4. Farge :Fargeverdien spesifiserer fargen på skyggen. Enhver gyldig CSS-fargeverdi kan brukes.
Her er noen eksempler på hvordan du bruker "box-shadow"-egenskapen for å lage forskjellige typer skygger:
- For å lage en enkel fallskygge, bruk en positiv forskyvningsverdi og en lav uskarphetverdi, slik:
```css
box-shadow:5px 5px 5px #888888;
```
- For å lage en mykere skygge, øk uskarphetverdien, slik:
```css
box-shadow:5px 5px 10px #888888;
```
- For å lage en bredere skygge, øk spredningsverdien, slik:
```css
box-shadow:5px 5px 10px 5px #888888;
```
- For å lage en farget skygge, spesifiser en fargeverdi, slik:
```css
box-shadow:5px 5px 10px 5px rød;
```
Egenskapen "box-shadow" er et kraftig verktøy som kan brukes til å lage en rekke visuelle effekter. Eksperimenter med forskjellige verdier for å se hva du kan lage!
