Page 93 - Сила CSS3 Освой новейший стандарт

Графические эффекты без графики • 93

• создание эффекта сияния (см. http://desandro.com/articles/the-new-lens-flare);
• создание эффекта типографского, выгравированного, вырезанного или выдавленного
текста путем добавления светлой тени с одной стороны и темной — с другой стороны
текста (см. http://sixrevisions.com/css/how-to-create-inset-typography-with-css3);
• создание пламенеющего текста с использованием множества желтых, оранжевых
и красных теней (см. http://www.css3.info/preview/text-shadow);
• создание размытого текста, используя тень того же цвета, что и сами символы, или же
просто окрашивая текст прозрачным цветом (см. http://simurai.com/post/684792689/
text-blur);
• создание объемной «стопки символов» с использованием множества теней (см. http://
css-tricks.com/3d-text-tower);
• создание ссылок, которые при щелчке на них утапливаются, как кнопки, за счет укоро-
чения тени (см. http://www.impressivewebs.com/text-shadow-links).

Кроме того, я рекомендую посетить страницу http://maettig.com/code/css/text-shadow.html;
здесь вы найдете множество примеров эффектов, созданных с помощью text-shadow. Не-
которые оказываются весьма полезными на практике, другие просто забавные, но в любом
случае, они могут послужить отличным источником вдохновения.

Таблица 2.6. Поддержка свойства text-shadow в браузерах
IE Firefox Opera Safari Chrome

Нет Да Да Да Да

Обходные пути для IE
Фильтры для IE DropShadow, Shadow и Glow, о которых я упоминала ранее, способ-
ны создавать падающие тени не только для полей, но и для текста. Для создания
текстовой тени фильтр записывается точно так же, как для создания тени поля, но
необходимо удостовериться, что с элементом не связан фоновый цвет или фоновое
изображение. Если у элемента есть фон, то IE применяет тень к самому полю; если
же фон отсутствует, тень применяется к содержимому.

К сожалению, применение любого из перечис-
ленных фильтров делает текст очень неровным. Если вы используете каркас
Приблизительно такой же эффект мы наблюда- JavaScript MooTools, я рекомен-
ли, когда применяли в IE фильтр Gradient (см. дую вам опробовать сценарий
MooTools для создания падающих
рис. 2.17 и 2.20), но на этот раз все еще хуже. теней, работающий в IE и других
Как мне кажется, в нашем примере с облачками браузерах (http://pr0digy.com/
комментариев падающая тень делает текст со- mootools/text-dropshadows).
вершенно нечитаемым, а ведь смысл добавления

www.trk.kg