@lufasab

:root, @custom-media etc — это валидный css?

Полез в исходники flexboxgrid и вижу там файл в src с расширением .css и там куча непонятных селекторов, атрибутов:

:root {
  --gutter-width: 1rem;
  --outer-margin: 2rem;
  --gutter-compensation: calc((var(--gutter-width) * 0.5) * -1);
  --half-gutter-width: calc((var(--gutter-width) * 0.5));
  --xs-min: 30;
  --sm-min: 48;
  --md-min: 64;
  --lg-min: 75;
  --screen-xs-min: var(--xs-min)em;
  --screen-sm-min: var(--sm-min)em;
  --screen-md-min: var(--md-min)em;
  --screen-lg-min: var(--lg-min)em;
  --container-sm: calc(var(--sm-min) + var(--gutter-width));
  --container-md: calc(var(--md-min) + var(--gutter-width));
  --container-lg: calc(var(--lg-min) + var(--gutter-width));
}

@custom-media --sm-viewport only screen and (min-width: 48em);
@custom-media --md-viewport only screen and (min-width: 64em);
@custom-media --lg-viewport only screen and (min-width: 75em);


Если бы это был например scss, sass, less - я бы вопрос не задавал. А это что разве CSS? В CSS что можно использовать переменные как в Sass? Непонятно, это рабочий код, я могу это использваоть без препроцессоров и таск раннеров?
  • Вопрос задан
  • 924 просмотра
Решения вопроса 1
delphinpro
@delphinpro Куратор тега CSS
frontend developer
Да, переменные в css можно использовать - Переменные в CSS: зачем они нам?

@custom-media - а это что-то из области postcss наверное.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы