САЙТЫ  ПОД  КЛЮЧ
ОНЛАЙН-СЕРВИСЫ СПРАВОЧНИКИ SEO-ИНСТРУМЕНТЫ РАЗВЛЕЧЕНИЯ

Справочник по CSS

Фильтр DropShadow

Internet Explorer Chrome Opera Safari Firefox Android iOS
6.0+ 8.0+

Краткая информация

Значение по умолчанию Нет.
Наследуется Нет
Процентная запись Не применима
Применяется Ко всем элементам.

Версии CSS

CSS 1 CSS 2 CSS 2.1 CSS 3

Описание

Добавляет к элементу тень, а также её направление и цвет.

Синтаксис

filter: progid:DXImageTransform.Microsoft.DropShadow(параметры)

Параметры

enabled
Включает или выключает фильтр. Значение true разрешает использование фильтра, false запрещает.
color
Цвет тени.
offX
Смещение тени по горизонтали. Положительное значение смещает тень вправо, отрицательное влево. По умолчанию равно 5.
offY
Смещение тени по вертикали. Положительное значение смещает тень вниз, отрицательное вверх. По умолчанию равно 5.
positive
Определяет, как должна отбрасываться тень. Значение true устанавливает тень от непрозрачных участков, false от прозрачных.

Параметры внутри фильтра перечисляются через запятую в любом порядке.

Пример

HTML5CSS2.1IECrOpSaFx

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>filter</title>
  <style>
   .opacity { 
    border: 1px solid #000;
    /* Тень у первой картинки */
    filter: progid:DXImageTransform.Microsoft.DropShadow(color=#333333);
   }
   .transparent { 
    margin-left: 20px;
    /* Тень от прозрачных участков у второй картинки */
    filter: progid:DXImageTransform.Microsoft.DropShadow(color=#cccccc, positive=false);
   }
  </style>
 </head> 
 <body>
  <p><img src="images/igels.png" alt="Ёжик" class="opacity">
  <img src="images/clover.png" alt="Клевер" class="transparent"></p> 
 </body>
</html>

Результат данного примера показан на рис. 1. Первый рисунок не содержит прозрачных участков, второй содержит, поэтому тень отбрасывают именно они, поскольку задан параметр positive.

Добавление тени

Рис. 1. Добавление тени

Браузеры

В IE6 и в IE7 фильтры применяются только для элементов, у которых установлено свойство hasLayout.

Internet Explorer 9 не добавляет фильтры к элементам при печати документа.

Справочник по CSS. Версия 7.0 от 5.11.12

© 2002–2012 Влад Мержевич, по всем вопросам пишите по адресу vlad@htmlbook.ru

htmlbook.ru


Дежурная шутка

— Мама не разрешает мне заходить в интернет. Она говорит, что там разврат, мат и плохо. Единственный сайт, который я могу открыть - это about:blank.
— Сначала было скучно, но потом я втянулся. Теперь у меня там живет два воображаемых друга и я слышу голоса из розетки.


Наши реквизиты
WMID: 309688839848
WMR: R325885159214
E-mail: 
  BL:Бизнес-уровень [BL]
QR-код сайта
Онлайн-радио
Больше радиостанций