box-shadow - definiuje cień elementu.
Polecenie przyjmuje cztery wartości:
- poziome przesunięcie cienia; dodatnia wartość powoduje wyświetlenie cienia po prawej stronie elementu, ujemna po lewej
- pionowe przesunięcie cienia; ujemna wartość powoduje przesunięcie cienia na górę elementu, dodatnia na dół
- stopień rozmazania; 0 oznacza ostry cień, im wyższa wartość tym bardziej rozmazany
- kolor cienia
Narożniki cienia, mogą być zaokrąglone poleceniem Border-radius.
Przykład użycia:
div
{
shadow: -15px -15px 5px #888; /* przesunięty w górę i w lewo, lekko zamazany, szary cień */
padding: 7px;
}
div
{
box-shadow: -10px -10px 0px #000; /* przesunięty w górę i w lewo, ostry, czarny cień */
border-radius: 5px; /* lekko zaokrąglone narożniki */
padding: 7px;
}
Polecenia pokrewne
- Border-radius
Odpowiednik html
- brak
Wersja specyfikacji
- CSS 3
Wsparcie przeglądarek
- Chrome i Safari obsługuje to polecenie testowo (z przedrostkiem -webkit- )
- Firefox obsługuje to polecenie testowo (z przedrostkiem -moz)
- Opera obsługuje to polecenie od wersji 10.60
- Internet Explorer obsługuje to polecenie od wersji 9