CSS-egenskaben `box-shadow` tilføjer skyggeeffekter omkring et element. Dette kan bruges til at tilføje dybde og dimension til et element eller få det til at skille sig ud fra resten af indholdet på en side.
Egenskaben "box-shadow" tager op til fire værdier, som specificerer forskydning, sløring og spredning af skyggen og farven på skyggen.
1. Offset :Forskydningsværdierne angiver den vandrette og lodrette afstand af skyggen fra elementet. Positive værdier flytter skyggen til højre og ned, mens negative værdier flytter skyggen til venstre og op.
2. Slør :Sløringsværdien angiver mængden af sløring på skyggen. En højere sløringsværdi vil skabe en blødere skygge, mens en lavere sløringsværdi vil skabe en skarpere skygge.
3. Spredning :Spredningsværdien angiver mængden af spredning, der anvendes på skyggen. En højere spredningsværdi vil skabe en bredere skygge, mens en lavere spredningsværdi vil skabe en smallere skygge.
4. Farve :Farveværdien angiver farven på skyggen. Enhver gyldig CSS-farveværdi kan bruges.
Her er nogle eksempler på, hvordan du bruger egenskaben "box-shadow" til at skabe forskellige typer skygger:
- For at skabe en simpel faldskygge skal du bruge en positiv forskydningsværdi og en lav sløringsværdi, som denne:
```css
box-shadow:5px 5px 5px #888888;
```
- For at skabe en blødere skygge skal du øge sløringsværdien på denne måde:
```css
box-shadow:5px 5px 10px #888888;
```
- For at skabe en bredere skygge skal du øge spredningsværdien på denne måde:
```css
box-shadow:5px 5px 10px 5px #888888;
```
- For at skabe en farvet skygge skal du angive en farveværdi som denne:
```css
box-shadow:5px 5px 10px 5px rød;
```
Egenskaben `box-shadow` er et kraftfuldt værktøj, der kan bruges til at skabe en række visuelle effekter. Eksperimenter med forskellige værdier for at se, hvad du kan skabe!
