Box-shadow или тень при помощи CSS

Применение этой методики в интернете можно встретить очень часто. Методика создания теней для блоков при помощи CSS имеет как много плюсов, так и недостатков.

Мы рассмотрим более 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/

Поделиться в социальных сетях
ВКонтакте
Facebook
WhatsApp
Telegram
Автор статьи
Выгодный хостинг
Хостинг Beget

Выгодная партнёрская программа! Верните на свой счёт 20% с любой суммы от оплаты хостинга Beget!

Новое в блоге

Добавить комментарий

Смотрите также

Watch now

Написать в мессенджер

Связаться с нами прямо сейчас!