Тег: css

CSS Custom Properties. CSS-переменные vs Sass-переменные

CSS Custom Properties. CSS-переменные vs Sass-переменные

CSS-переменные — это пользовательские CSS-свойства (Custom Properties), экспериментальная технология, находящаяся на третей стадии редакторского черновика (Editor’s Draft, о котором уже упоминалось в статье про CSS вложенности. Но не смотря на это, пользовательские CSS-свойства поддерживаются в большинстве современных и популярных браузерах. Поэтому данный синтаксис вполне можно применять как есть, но если вам все-таки нужно осуществить поддержку и в более старых браузерах, то необходимо использовать плагин postcss-custom-properties.

Вложенные CSS-правила (CSS Nesting)

Недавно был опубликован редакторский черновик (Editor’s Draft) модуля CSS Nesting. В нем описаны новые правила синтаксиса, с помощью которых можно будет вкладывать одни CSS-правила в другие (наподобие того, как это делается в препроцессорах).

CSS Nesting Module. Вложенности в CSS

Ресурс для именования цветов. Переменные цветов SCSS, CSS

В процессе создания сайтов у нас может возникнуть проблема: как правильно назвать цвет? Нужно грамотное именование переменных!

Name that Color

Допустим, что на сайте пять оттенков зеленого. Как называть переменные цветов в SCSS, чтобы не путать? $color-green, $color-dark-green, $color-darken-green, $color-light-green — не самые удачные названия, т.к. мы сами будем путаться, какой цвет для чего нужен.