filter

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.Фильтр(свойства)

Фильтры

Alpha

Настраивает прозрачность объекта.

BasicImage

Устанавливает параметры цвета, поворота изображения или прозрачности.

Blur

Размывает содержимое.

Chroma

Показывает определенные цвета прозрачными.

DropShadow

Отображает тень.

Emboss

Показывает содержимое объекта в виде барельефа.

Engrave

Показывает содержимое объекта в виде черно-белой гравюры.

Glow

Добавляет свечение вокруг краев.

Gradient

Создаёт линейный градиент.

ICMFilter

Преобразует цвета содержимого на основе профиля системы управления цветом (Image Color Management, ICM).

Light

Создает эффект лучей света.

MaskFilter

Показывает прозрачные пикселы как цветную маску, а непрозрачные пикселы наоборот, прозрачными.

Matrix

Изменяет размер, поворачивает или отражает объект на основе матричных преобразований.

MotionBlur

Размывает объект так, словно он быстро движется.

Shadow

Добавляет тень.

Wave

Вносит волнообразные искажения.

Пример

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title> filter </title>

<style>

img.semi {

/* Прозрачность 50% */

filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);

}

</style>

</head>

<body>

<p><img src="example/images/igels.png" alt="Обычный ёжик">

<img src="example/images/igels.png"

 alt="Полупрозрачный ёжик" class="semi"></p>

</body>

</html>

Браузеры

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

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