Мы рассмотрим более 12 вариантов реализаций теней при помощи параметра box-shadow.
Для начала я просто обязан сказать о недостатках — это кроссбраузерность.
CSS параметр box-shadow поддерживают следующие браузеры:
IE 9+, Firefox 4.0+, Opera 10.5+, Safari 3.0+, Chrome 1.0+
Теперь соответственно о плюсах:
- Любой блок можно без труда быстро обрамить css тенью, настроить цвет тени и ее отступы от блока.
- Тень может быть как внешняя, так и внутренняя.
- С любой из четырех сторон блока можно использовать любой цвет тени, соответственно большая гибкость реализации.
- Весьма небольшой объем встраиваемого кода, также можно применить тень для конкретного браузера отдельно.
Сервис генерации кода — http://css3gen.com/box-shadow/
