Я использую медиа-запросы CSS на своем веб-сайте, чтобы переключиться на более вертикальное расположение на небольших устройствах. Это работает довольно хорошо, но я бы хотел добавить на сайт кнопку с надписью «Показать версию для настольного компьютера». Я хочу сделать эту кнопку (или ссылку, что угодно) принудительно или изменить оценки медиазапроса, чтобы они оценивали, как если бы ширина экрана была больше, чем она есть (например, 1200 пикселей вместо 320 пикселей). Это возможно?

Мой CSS выглядит так:

#logo {
    /* Mobile style */
    [...]

    @media (min-width: @screen-sm) {
        /* Desktop style */
        [...]
    }
}

#footer {
    /* Mobile style */
    [...]

    @media (min-width: @screen-sm) {
        /* Desktop style */
        [...]
    }
}

/* And so on... i.e. multiple piecewise styles, following the same pattern used in Bootstrap's css */

Я нашел этот интересный подход, который использует класс css в теле вместо медиа-запросов для переключения между макетами. Тем не менее, он полностью избавляется от реальных медиа-запросов и использует вместо этого javascript.Мобильные браузеры "Full Web" и медиазапросы размером с экран

редактировать

Уточненный пример CSS. Первые 2 ответа очень полезны, но я бы предпочел не менять полностью организацию css, чтобы разделить ее на версии для настольного компьютера и для мобильных устройств. Еще одна интересная техника:LESS: Можете ли вы сгруппировать селектор CSS с медиа-запросом?

редактировать 2

Интересный подход заключается в изменении медиа-запросов CSS через JavaScript. Это немного пугает меня, потому что поддержка браузера может быть ненадежной для такой неясной техники:http://jonhiggins.co.uk/words/max-device-width/