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