Эти два языка являются надстройкой над CSS (происходит кросскомпиляция в CSS), пытаясь решить его часто возникающие проблемы и обойти различные ограничения, такие как:
- Отсутствие переменных, что ведёт к частой копипасте шрифтов, размеров и т. д. и потребности всё это заменять через find & replace
- Отсутствие вычисляемых значений
Нельзя написать font-size: 18px + 2px; - Избыточность селекторов для вложенных элементов:
nav { ... }
nav ul { ... }
nav ul li { ... }
nav ul li a { ... }
nav ul li a:hover { ... } - Повторение одних и тех же строк по всему коду:
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
Теперь разработчики могут применить свои навыки в структурировании и соблюдении принципа DRY в таблицах стилей.
Оба языка поддерживают трансляцию как на стороне клиента, так и на стороне сервера.
Оба языка поддерживают трансляцию как на стороне клиента, так и на стороне сервера.
Языки позволяют:
- Интуитивно разбивать большие файлы на модули через @import
- Использовать переменные
- Использовать примеси
- Использовать вычисления: числовые, цветовые, строковую интерполяцию
- Использовать вложенные правила, что сокращает запись, делает её более читабельной и не даёт связанным правилам расползаться по всему файлу
- Управлять потоком выполнения (if, for ... )
Хочу ещё рассказать о том, как хотел попробовать LESS в студии.
На стороне сервера для компиляции/кэширования/минификации есть отличный хэндлер dotless (NuGet). Однако студия никак не стимулирует писать less, так как нет ни подсветки, ни статической валидации. Я попробовал один из плагинов, самый рекомендуемый - Mindscape Web Workbench, но остался недоволен - подсветка мелькает после каждого введённого символа, а снизу висит баннер, который абсолютно ненавязчиво предлагает купить сиё творение. В топку.
Да, к сожалению студия, даже с невероятными потугами решарпера, существенно отстаёт от той же идеи в области web разработки. Печально, но факт.
Сайты: