Sass (Syntaxically Awesome Style Sheets) - это расширение CSS, добавляющее такие функции, как вложенные правила, переменные, миксины и расширения классов. Это позволяет разработчикам создавать структурированные, управляемые и повторно используемые CSS. Sass компилируется в стандартный CSS.

Обзор:

Sass- это метаязык поверх css, который используется для описания стиль документа чистый и структурный, с большей мощностью, чем позволяет плоский CSS.

Sass - это расширение css3, написанное на ruby. Он добавляет вложенные правила, переменные, миксины, наследование селектора и полезные функции, такие как управление цветом или условные операторы 2 . Он переведен в хорошо отформатированный стандартный CSS с использованием инструмента командной строки или плагина веб-фреймворка.

Это единственный язык, который может хранить маркеры дизайна (например, цвета, размеры шрифтов, интервалы) и использовать типы значений 9 изначально ; то есть числа, цвета, строки, списки и логические значения.

Sass имеет два синтаксиса:

  1. SCSS (Sassy CSS): Начиная с Sass3, это основной синтаксис. Это расширенный набор CSS3, поэтому все допустимые файлы CSS также являются действительными SCSS. Файлы с этим синтаксисом имеют расширение .scss.

Пример SCSS:

$margin: 12px;

li {
  .border {
    margin: $margin / 2;
  }
}
  1. SASS: Синтаксис с отступом. Вместо скобок и точек с запятой для указания блоков используется отступ строки (аналогично синтаксису Ruby). Файлы с этим синтаксисом имеют расширение .sass.

Пример SASS:

$margin: 12px

li
  .border
    margin: $margin / 2

Каркасы / Расширения:

  • compass4 является расширением Sass который обеспечивает предопределенные кросс-браузерные миксины и дополнительные функции, такие как автоматическая генерация спрайтов.
  • bourbon5 - простая и легкая библиотека миксов для Sass.

Вкусы:

  • Ruby Sass 1 - оригинальная версия Sass на основе Ruby.
  • LibSass 6 является портом C / C ++ прекомпилятора Sass. Он компилируется очень быстро, может быть встроен в другие языки и двоичные файлы и стремится к паритету функций с оригинальным Ruby Sass.
  • Node Sass 7 использует LibSass для компиляции файлов .scss с использованием Node.

Ссылки:


Ресурсы: