Блог

Главная - Вопросы по программированию - Переменная SASS с медиа-запросом приводит к «Недопустимому CSS после «@»»

Переменная SASS с медиа-запросом приводит к «Недопустимому CSS после «@»»

#sass

#sass

Вопрос:

Основная идея заключалась бы в том, чтобы определить мой медиа-запрос в одном месте. Моя текущая попытка выглядит так:

 $mobile: "@media (max-width: 600px):not(#app.force-desktop)";


#{$mobile} {
  ...
}

Однако это приводит к ошибке: SassError: Invalid CSS after "@": expected selector, was "@media (max-width: " установка $mobile на (например) :not(#app.force-desktop) , кажется, только правильно компилируется.

Возможно, есть другой способ решить эту проблему, который меня вполне устроил бы.

Ответ №1:

Вы можете просто удалить @media :

 $mobile: '(max-width: 600px):not(#app.force-desktop)';

@media #{$mobile} {
    body {
        color: blue;
    }
}

Комментарии:

1. Спасибо, что работает… хотя кажется, что часть:not все равно не является допустимым CSS… думаю, вместо этого мне придется использовать смешанный подход. Ну что ж.

2. О, я даже этого не заметил. Да :not , это должно было бы войти в медиа-запрос