CSS3 - новый стандарт оформления HTML-документов

17 сентября 2014
CSS3 (англ. Cascading Style Sheets 3 — каскадные таблицы стилей третьего поколения).

Самая масштабная редакция по сравнению с CSS1, CSS2 и CSS2.1. Главной особенностью CSS3 является возможность создавать анимированные элементы без использования JS, поддержка линейных и радиальных градиентов, теней, сглаживания и многое другое.Многие возможности, которые были труднодоступны в CSS2.1, то есть требовали использования дополнительных внешних программ (таких как Adobe Photoshop), скриптов (таких как JavaScript) или специальных "хитростей" могут легко достигаться в CSS3 за счет использования новых свойств оформления.


В CSS3 мы можем:

  • Создавать элементы со сглаженными углами;
  • Создавать линейные и сферические градиенты;
  • Более гибко оформлять фоновую картинку элементов;
  • Добавлять к элементам и к тексту элементов тени;
  • Использовать небезопасные шрифты (не боясь при этом, что они будут не поддерживаться браузером пользователя);
  • Создавать анимацию и различные эффекты переходов;
  • Задавать цвета  новыми способами и многое другое.

Необходимо иметь в виду, что новые свойства CSS3 доступны только при использовании новых версий браузеров, таких как IE9+, Firefox 3.6+, Opera 10+, Chrome 12+, Safari 5+. К тому же спецификация пока продолжает разрабатываться, поэтому некоторые свойства будут изменяться.

Доля использования старых браузеров полностью или частично не поддерживающих CSS3 уже не так велика (данные StatCounter на Октябрь 2013):

  • Internet Explorer 9 (частично не поддерживает CSS3 свойства): 3%
  • Internet Explorer 8 (не поддерживает CSS3 свойства): 4.5%

Однако мы все же рекомендуем дополнительно анализировать количество пользователей использующих старые браузеры для каждого сайта индивидуально (например с помощью Google Analytics) и если это количество еще велико воздержатся от использования свойств, которые могут привести к проблемам отображения сайта в старых браузерах.

Для эмуляции поведения новых свойств CSS3 в браузерах Internet Explorer 6-9 Вы можете использовать специальную библиотеку css3pie.