Игра теней / эксперименты со свойством text-shadow / css3
Сегодня мы поговорим о таком замечательном свойстве css3, как text-shadow. Оно, как можно понять из названия, добавляет самую обычную (ну не совсем) тень к тексту. Ее особенность в том, что тень можно регулировать - вылет тени, цвет и размытие. Это свойство уже присутствовало в css2, затем в css2.1 его выкинули и опять вернули в css3.
Ознакомимся с синтаксисом. Выглядит он так:
text-shadow:1px 2px 3px #000;
где 1px - смещение тени на 1px вправо (чтобы сместить влево, надо задавать отрицательное значение), 2px - смещение на 2px вниз (чтобы сместить вверх, надо задавать отрицательное значение), 3px - размытие тени (чтобы тень была четкой, присвойте значение 0) и #000 - цвет тени (можно задавать в формате rgba). Кстати, не забываем, что для одного элемента можно задавать несколько теней (через запятую: text-shadow:2px 2px 2px red, -2px -2px -2px blue;).
Вот и все. Особенно хочется отметить поддержку браузерами: google - 2+, mozilla - 3.1+, opera - 9.5+, safari - 1.1+, ie - 10+. То есть, с учетом распространенности старых "ослов" и только недавней версии Internet Explorer 10 Release Preview, об IE можно забыть). Но, адекватные браузеры (включая яндекс.браузер) это свойство поддерживают хорошо.