Пишу про разработку вообще и в частности про: JavaScript, HTML5, CSS3, AngularJS, ReactJS, Agile.

Как группировать стили в CSS

CSS3 позволяет группировать стили не только по явно заданному классу, но и по его части. Это очень удобный инструмент для объединения стилей по их названию, а не только по распределению в файле CSS.

Приведу живой пример. Скажем у вас есть несколько стилей, которые так или иначе отвечают за цвет объекта. Все они начинаются со слова “color-“, например color-header, color-footer.

Теперь если вам необходимо добавить всем этим стилям так же тень, то нет необходимости объединать их в одну группу, вы можете просто добавить стиль по маске имени класса:

Стоит отметить что существует так же новые возможности по выбору элементов относительно аттрибутов тега: href, type, data-* и т.п. Лично мне этот подход не очнь нравится такъ как атрибуты предназначрно больше для передачи инфорамации, а не для определения оформления элемента. Однако, вы впоне можете использовать лживой удобный для вас метод.

Поделиться:
comments powered by Disqus