Свойство box-shadow добавляет тень к элементу. Тень не влияет на размер и расположение самого элемента (несмотря на то, что тень может быть расположена далеко за пределами элемента), но она может перекрываться другими элементами расположенными в коде после текущего элемента или перекрывать другие элементы, расположенные в коде перед текущим элементом. Допускается добавлять несколько теней, указывая их параметры через запятую: | Значение по умолчанию: | none | | Наследуется: | нет | | Версия: | CSS3 | | Синтаксис JavaScript: | object.style.boxShadow="10px 10px 5px #888888" | Примечание: первые 4 значения, описываемые в таблице, указываются с помощью единиц измерения поддерживаемых в CSS. | Значение | Описание | | смещение-x и смещение-y | Первые два значения устанавливают смещение тени. Первое значение (смещение-x) указывает расстояние смещения по горизонтали. Отрицательные значения располагают тень слева от элемента. Второе значение (смещение-y) указывает расстояние смещения по вертикали. Отрицательные значения располагают тень над элементом. Если оба значения 0, тень располагается за элементом и её не будет видно, так как по умолчанию тень имеет тот же размер, что и у элемента. (обязательные значения) | | размытие | Третье значение устанавливает степень размытия тени. Чем больше это значение, тем сильнее размытость - тень становится более большой и светлой. Отрицательные значения не допускаются. Если значение отсутствует или равно 0, это означает, что тень будет без размытия - с острыми углами. (необязательное значение) | | размер тени | Четвёртое значение изменяет размер тени. Положительное значение увеличивает размер тени со всех сторон, отрицательное - уменьшает. Если значение отсутствует или равно 0, это означает, что тень будет того же размера, что и элемент. (необязательное значение) | | цвет | Определяет цвет тени. Цвет можно установить различными способами, например: указать имя цвета, использовать шестнадцатеричные значения (HEX), с помощью синтаксиса RGB (RGBA) или HSL (HSLA). Всегда указывайте цвет тени, так как браузеры по разному обрабатывают отсутствие значения цвета. | | inset | Ключевое слово, указывающее, что тень должна располагаться внутри элемента. Внутренняя тень создаёт эффект вдавленности и располагается над фоновым цветом и/или фоновым изображением, но под любым содержимым элемента. Если ключевое слово не указано, тень будет отбрасываемая, т.е. будет располагаться под элементом. Ключевое слово может быть расположено в качестве первого или последнего значения. (необязательное значение) | | none | Указывает на отсутствие тени. |
|