Просмотров: 1 761

Text-shadow не отображается в браузере Internet Explorer (IE).

Свойство text-shadow, которое мы разбирали в предыдущей заметке, работает замечательно, но если использовать следующий код в браузере Internet Explorer ниже 10 версии,

11-05-2013 15-56-11

<p style="text-shadow:5px 5px 2px #000; font-size:24px">Текст с тенью</p>

то никакого эффекта тени в нем мы не увидим.

Internet Explorer (IE) не понимает свойства text-shadow до своей 10 версии.

Как же можно решить эту проблему и заставить этот браузер отображать тень?

Нужно использовать так называемые фильтры. Официальная документация от Microsoft по фильтру Shadow находится здесь:

http://msdn.microsoft.com/en-us/library/ms533086(v=vs.85).aspx

Настройки тени с помощью фильтра несколько более скудные, чем те, которые предоставляет свойство text-shadow.

Но, тем не менее, выбирать не приходится.

filter: progid:DXImageTransform.Microsoft.Shadow(Color=#666666, Direction=45, Strength=4);

Здесь:

colorцвет тени.

Direction – это угол наклона (направление) тени. Задается в градусах с шагом 45 градусов.

0 – направление вверх
45 - направление вверх, вправо
90 - направление вправо
135 - направление вниз, вправо
180 - направление вниз
225 - направление вниз, влево
270 - направление влево
315 - направление вверх, влево

Strength – так называемая сила (величина) тени в заданном направлении. Может принимать значения от 1 – 255.

11-05-2013 15-55-30

Честно говоря, тень получается совсем не такая качественная, как это было с text-shadow, но ничего не поделаешь, остается ждать, когда пользователи полностью перейдут на новые браузеры.