Градиенты с помощью CSS3 »perun.net

  1. Похожие сообщения:
  2. Автор Владимир

Использование CSS3 для реализации цветовых градиентов не является чем-то новым. Вот очень простой пример:

.evolution {background: -moz-linear-Gradient (вверху, # 900, # 079); цвет: #fff; набивка: 2,5em 3em; }

Этот пример выглядит в Mozilla Firefox следующим образом:

Этот пример выглядит в Mozilla Firefox следующим образом:

Это не все, что возможно с CSS3, как в статье CSS-градиенты для всех веб-браузеров и запись в Mozilla документация покажи это ясно. Можно генерировать не только линейные, но и радиальные градиенты.

Все это возможно не только в Firefox, но и в других браузерах. С помощью -webkit-градиента вы можете использовать WebKit-Browser (Safari, Chrome), Opera с 11.10 с -o-linear-Gradient и даже Internet Explorer.

При этом вы должны обратить внимание на Internet Explorer, в зависимости от того, какая версия используется:

  • -ms-линейный градиент IE 10
  • фильтр: progid: DXImageTransform.Microsoft.gradient (...); IE 5.5-9

Хотя Internet Explorer 10 использует CSS3, более старые версии по-прежнему используют фильтры Microsoft. Кто не хочет запоминать все «лишние колбаски» для разных браузеров, может на Окончательный Генератор Градиента CSS рисовать:

Этот генератор не только удобен, но также предлагает множество функций и, что наиболее важно, он генерирует код, который учитывает Geckos (Firefox, SeaMonkey), WebKits (Safari, Chome), Opera и Internet Explorer.

Похожие сообщения:

реклама

реклама

Автор Владимир

Владимир Симович работает с HTML и CSS с 2000 года, а с WordPress с января 2004 года. За эти годы он опубликовал различные специальные книги и статьи.