CSS3 text-shadow

Благодаря БлоGноту узнал об официальном открытии сервиса «Я.ру», походил по ссылкам и обратил внимание, что в Opera 9.50 некоторые ссылки как-то интересно подсвечиваются. До того интересно, что я было подумал, что «оперовцы» реализовали CSS-фильтры из Internet Explorer. Оказывается, нет, это работает CSS3-свойство text-shadow (позволяет добавлять к тексту тень), которое на данный момент поддерживается браузерами Safari (и его кузенами), Konqueror, iCab и теперь ещё «Оперой».

Интересно, что тени (text-shadow) можно накладывать на текст по нескольку раз, что даёт интересные визуальные эффекты, например тот, который вы увидите ниже, если ваш веб-браузер поддерживает text-shadow:

Многократные тени — впечатляющая штука

Как обычно, идея позаимствована из Internet Explrorer, там есть фильтр «drop shadow», который занимается тем же самым.

<div style="cursor:hand;height:160px; padding:10px; font:bold 13pt Verdana;
        filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, 
        Color='gray', Positive='true')">
Текст с тенью
</div>

Причём, фильтр можно наложить несколько раз (добившись эффекта множественной тени), если окружить текст несколькими тегами и наложить на каждый тег по фильтру.

Читайте также

Перевод картинки в серый средствами CSS
Серое в CSS (92.76КиБ) Экспериментировал в рамках прототипа для рабочего проекта с преобразованием изображения в серую гамму.
2012
Dictatorship IE vs. Open Source Dictatorship
Удивительная избирательная слепота у людей. На «Хабре» опубликовали статью «Новые возможности HTML и CSS в Safari 3.1», где народ восторженно обсуждает возможности, появившиеся в браузере «Сафари».
2008
index.phps
<title>Вектор идей. Евгений Степанищев aka Bolk, 2008</title> <meta http-equiv="content-type" content="text/html; charset=windows-1251" />
2008

Комментарии 3