Обложка канала

Frontender's notes

Годные заметки, новости, видео и интересные статьи для Frontend разработчиков.

Frontender's notes

3 года назад
Открыть в
Использование переменных в CSS Всем привет!  В JavaScript-мире препроцессоры CSS — это очень полезные и популярные технологии. Препроцессоры расширяют возможности CSS, позволяя пользоваться, например, переменными и функциями. Но нам теперь доступны более мощные возможности CSS, например мы можем создать переменные без использования препроцессоров. Как это сделать: Для объявления переменной достаточно поставить два тире (--) перед её именем. После этого, там, где нужно значение переменной, вызывают функцию var(), передавая ей созданную ранее переменную в качестве аргумента. Пример: :root {   --base: #ffc600;   --spacing: 10px;   --blur: 10px; } img {   padding: var(--spacing);   background: var(--base);   -webkit-filter: blur(var(--blur));   filter: blur(var(--blur)); } .hl {   color: var(--base); } Собственно как то так, удачи вам в экспериментах!