Так что же такое фильтр ? Фильтр - это эффект для изменения внешнего вида текста или
графики на странице. Для применения фильтра используется свойство filter каскадный листов стилей, тоесть CSS. Отображаются фильтры ТОЛЬКО в броузерах Internet Explorer не ниже 4-й версии.

Синтаксис фильтра таков:
"filter:имя_фильтра(параметр1=значение, параметр2=значение, ... )"
Для некоторых фильтров параметры могут вообще отсутствовать.

Также фильтры делятся на два типа: статические и динамические. Со статическими всё ясно - меняется внешний вид объекта, а сам он остаётся неподвижным. Динамические фильтры позволяют изменять графический элемент с задаваемой пользователем скоростью переключения кадров (ну, мультик получается... :)) Статических фильтров существует 14, динамических - 23.

Перейдём к практике. Возьмём картинку (img.gif)

и применим к ней фильтр прозрачности:
<IMG SRC=img.gif STYLE="filter:alpha(opacity=50)"> - имеем ту же картинку, но полупрозрачную:

Вот эффект сложнее:

<IMG SRC=img.gif STYLE="filter:wave(freq=5, strength=4, lightstrength=25)"> - в итоге наша картинка развивается стягом, в котором freq отвечает за количество всплесков, strength - за размер каждого всплеска в пикселях и lightstrength - за яркость света.

Ниже приведена таблица всех статических фильтров с их параметрами и описанием.

  А теперь посмотрите эти статические фильтры в действии

Фильтр Blur размывает рисунок в определенную сторону.

Синтаксис:
STYLE="filter:Blur(Add = add, Direction = direction, Strength = strength)"
Add - Или 0, или 1.
Direction - От 0 до 315 - в какую сторону произойдет размытие.
Strength - Смещение

Пример:
<style>
.gr2{filter:Blur(Add="1",Direction="310",Strength="10")}
</style>
<img class="gr2" src="img.gif">
или:
<STYLE>.pr77 {
    filter:Blur(Add="1",Direction="310",Strength="10")
}
</STYLE>
<DIV class=pr77
style="COLOR: red; FONT-SIZE: 25pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; HEIGHT: 25px; LINE-HEIGHT: normal; WIDTH: 400px">Я самая
размытая</DIV>

Фильтр  DropShadow добавляет силуэт объекта, смещенный в определенном направлении. В данном случае задана желтая тень, для прозрачных пикселей.

Синтаксис:
STYLE="filter:DropShadow(Color=color, OffX=Offx, OffY=Offx, Positive=positive)"
Color - Цвет тени(#ff0000)
OffX - Смещение тени по X
OffY - Смещение тени по Y
Positive - Любое целое значение (не равное 0) создает тень для видимых пикселей объекта, '0' (false) - для невидимых пикселей.

Пример:
<STYLE>.pr6 {
    FILTER: DropShadow(Color="#6699CC",OffX="5",OffY="5",Positive="1")
}
</STYLE>
<p><img class="pr6" src="logo1.gif" width="120" height="43"><br>
<DIV class=pr6
style="COLOR: red; FONT-SIZE: 25pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; HEIGHT: 25px; LINE-HEIGHT: normal; WIDTH: 400px">Я самая
оттенистая</DIV></p>

Исходный рисунок ...

... с применением фильтра

Фильтр FlipV переворачивает объект вертикально.

Синтаксис:
STYLE="filter:FlipV"

Пример:
<style type="text/css">
.pr3{filter:FlipV;}
</style>
<p align="center">
<img class="pr3" src="logo.gif" width="120" height="43"><br>
</p>
<div class="pr3" style="width:180;height:26;font:15pt;color:red;">Я самая перевернутая</div>

Gray

Фильтр Gray делает рисунок черно-белым

Синтаксис:
STYLE="filter:Gray"

Пример:
<style>
.gr4{filter:Gray}
</style>
<img class="gr4" src="1m.jpg">

Фильтр  Light делает объект таким, как если бы на него посветили. Световые фильтры применяются, устанавливая световой источник, определенный одним из следующих методов:

AddAmbient (R,G,B,strength)
Добавляет окружающий световой источник к изображению. Окружающий свет не-направлен и освещает всю область. Солнце испускает окружающий свет. Синтаксис:

object.style.filters.Light(n).addAmbient(R,G,B,strength)  

Где  R ,  G и  B - значения (0-255), чтобы определить цвет окружающего света , и  strength  определяет 'количество' света.

AddCone (x1,y1,z1,x2,y2,R,G,B,strength,spread)
Добавляет к изображению, источник освещения в виде конуса. Свет направленный и освещает только определенную область. Синтаксис:

object.style.filters.Light(n).addCone(x1,y1,z1,x2,y2,R,G,B,strength,spread)  

Где  x1 ,  y1 Значения определяющие положение источника света,  x2 и  y2 - определяют координаты куда направлен свет,  R ,  G и  B - значения (0-255), чтобы определить цвет света, strength   определяет 'количество' света. и  spread определяет угол распространения (0-90, в градусах).

AddPoint (x,y,z,R,G,B,strength)
Добавляет к изображению точечный источник освещения.Точечный источник освещения - лампочка. Синтаксис:

object.style.filters.Light(n).addPoint(x,y,z,R,G,B,strength)  

Где  x ,  y и  z координаты точечного источника освещения...
осталные параметры как у других методов

Еще несколько методов Светового Визуального фильтра:

ChangeColor (lightnumber, r,g,b, fAbsolute)
Метод  ChangeColor изменит цвет светового фильтра, примененного к объекту. Используйте  lightnumber чтобы определить световой источник, чей цвет должен быть изменен (это - позиция в массиве Lights), r,g и b, новый цвет,  fAbsoloute может принимать значение true (nonzero), и false (т.е. zero),на что это влияет посмотрите сами...

ChangeStrength (lightnumber, strength, fAbsolute)
Метод ChangeStrength изменяет силу определенного светового фильтра ( крторый определяется аргументом lightnumber ) на силу определенную в параметре  strength ...

Clear
Метод  Clear удаляет все источники света для определенного светового фильтра.

MoveLight (lightnumber, x, y, z, fAbsolute)
Метод  MoveLight передвигает источник света (в случае AddPoint), место освещения (в случае AddCone). x ,  y и  z значения определяющие положения передвижения света, или абсолютно (  fAbsoloute=nonzero ) или относительно ( fAbsolute=false ).

Фильтр Shadow делает объекту тень
Синтаксис:
STYLE="filter:Shadow(Color=color, Direction=direction)"
color - цвет тени.
Direction - (от 0 до 315)направление тени.

Пример:
<style>
.pr2{filter:Shadow(Color="#000000", Direction="150")}
</style>
<div class="pr2" style="width:180;height:26;font:16pt;color:red;">Я самая теневая</div>

Xray

Фильтр Xray воздействует на объект как Х-луч - черно-белый негатив.

Синтаксис:
STYLE="filter:Xray"

Пример:
<style>
.gr6{filter:Xray}
</style>
<img class="gr6" src="a2.gif">