CSS3 Свойство box-shadow
Полный CSS Справочник
Пример
Добавить тень от блока к элементу div:
div
{
-webkit-box-shadow: 10px 10px 5px #888888; /* Safari и Chrome */
box-shadow: 10px 10px 5px #888888;
} |
Попробуйте сами » Еще примеры внизу этой страницы.
|
Поддержка Браузерами
Свойство box-shadow поддерживается в IE9+, Firefox 4, Chrome и Opera.
Safari поддерживает альтернативное свойство -webkit-box-shadow.
Определение и ИспользованиеСвойство box-shadow добавляет один или более эффектов отбрасывания тени к блоку.
Значение по умолчанию: |
none |
Наследуется: |
нет |
Версия: |
CSS3 |
JavaScript синтаксис: |
объект.style.boxShadow="10px 10px 5px #888888" |
Синтаксис
box-shadow: h-тень v-тень размытие протяженность цвет inset; |
Замечание: Свойство box-shadow присоединяет один или более эффектов отбрасывания тени к блоку.
Это свойство задается списком теней через запятую, каждая тень указывается 2-4
значениями длин, необязательным значением цвета и необязательным ключевым словом inset. Пропущенные
длины приравниваются к нулю.
Значение |
Описание |
h-тень |
Обязательно. Положение горизонтальной тени. Допустимы отрицательные значения. |
v-тень |
Обязательный параметр. Положение вертикальной тени. Допустимы отрицательные значения |
размытие |
Не обязательный параметр. Расстояние размытия. |
протяженность |
Не обязательно. Размер тени |
цвет |
Не обязательно. Цвет тени. Смотрите полный список с возможными
значениями цветов в Справочнике Значений Цветов CSS. |
inset |
Не обязательно. Изменяет тень с внешней (выпуклой) на внутреннюю тень
|
 |
Попробуйте сами - Примеры |
Фотографии, разбросанные по столу
Этот пример демонстрирует, как создавать изображения, которые смотрятся как фотографии "c полароида", и вращать рисунки.
Смотрите ТакжеCSS3 уроки: CSS3 Границы
Полный CSS Справочник
|