меньше и Bootstrap переменных между значениями

Question

У меня есть по умолчанию переменного Bootstrap и они прекрасно работают, однако у меня есть:

@media (max-width: @screen-xs-min) { 
} 

Как я могу также иметь переменный между @screen-xs-min и @screen-sm-min?

Answer 1

@media (min-width: @screen-xs-min) and (max-width: @screen-sm-min){ ...CSS Code Here }

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

@media (max-width: @screen-sm-min){ ...CSS Code Here }

для таблеток, и когда вы обнаружите, что некоторые элементы не смотрите прямо на телефоны переопределять эти правила планшета с:

@media (max-width: @screen-xs-min){ ...CSS Code Here }

Это, как говорится , Я часто нахожу необходимость использовать максимальную ширину и минимальную ширину вместе для небольших настроек, обычно один или два стиля, когда я получаю гибкий макет вместе.