Как использовать логику SASS в медиа-запросе CSS 3 [дубликат]

На этот вопрос уже есть ответы здесь :

Использование переменных Sass с медиа-запросами CSS3 (6 ответов)

Закрыто 4 года назад .

Я использую saas через структуру компаса и зависимость blueprint / grid. Я хочу иметь возможность установить ширину столбца с помощью медиа-запроса, например:

// /src/partials/_base.scss
$blueprint-grid-columns: 18;

@media screen and (max-width: 1024px){
    // If screen res is 1024 or lower, then set grid width to 46px
    $blueprint-grid-width: 46px;
}
@media screen and (max-width: 1280px){
    $blueprint-grid-width: 50px;
}
@media screen and (max-width: 1600px){
    $blueprint-grid-width: 76px;
}

$blueprint-grid-margin: 8px;

Это компилируется в /stylesheets/screen.css:

@media screen and (max-width: 1024px) {}
@media screen and (max-width: 1280px) {}
@media screen and (max-width: 1600px) {}

Но значения в остальной части screen.css не установлены соответственно. Я думаю, это имеет смысл, поскольку переменная $ blueprint-grid-width считывается во время компиляции, а не во время выполнения.

Есть ли способ вывести макет с разной шириной сетки с помощью медиа-запроса для получения разрешения экрана?

Связанная проблема с github:
https: // github. com / chriseppstein / compass / issues / 302

задан OldTroll 25 July 2011 в 23:00

0 ответов

Другие вопросы по тегам:

css media-queries compass-sass sass

Как использовать логику SASS в медиа-запросе CSS 3 [дубликат]

0 ответов

Похожие вопросы: