Использование ширины 1170px с помощью bootstrap.css(отзывчивый)

Я заметил в twitter docs для grid system, в котором говорится, что сетка по умолчанию - 940px, но это 1170px на веб-сайте. Я понимаю, что он использует отзыв для изменения ширины, поскольку я на широкоэкранном и более высоком разрешении.

Мой вопрос падает на то, как я могу использовать 1170px, как в твиттер-документах. Я не могу найти какие-либо документы, объясняющие, как изменить ширину до 1170px, как они есть. Это обычная сборка, которую они создали, но не выпущенные или просто не обновленные документы?

Любые идеи, как реализовать это и иметь правильные настройки настройки сетки для 1170px.

Ответы

Ответ 1

Они используют запрос @media для этого, который по умолчанию не включен в бутстрап, вы можете прочитать об этом здесь в своем отзывчивом макете.

Важный бит из их CSS:

@media (min-width: 1200px) {
  .span12, .container {
    width: 1170px;
  }
}

Отрывок со страницы

Использование медиа-запросов

Bootstrap автоматически не включает эти медиа-запросы, но понимание и добавление их очень просто и требует минимальной настройки. У вас есть несколько вариантов включения отзывчивых функций Bootstrap:

Используйте скомпилированную отзывчивую версию, bootstrap-responsive.css

Добавить @import "responsive.less" и перекомпилировать Bootstrap

Модифицировать и перекомпилировать responsive.less как отдельный
Почему бы просто не включить его? По правде говоря, не все должно быть отзывчивый. Вместо того чтобы поощрять разработчиков к удалению этой функции, мы считаем, что лучше всего включить его.

Ответ 2

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

Я видел, как некоторые веб-сайты снимали этот отрывок из медиа-запроса (@media min-width: 1200px {...}) из гибкой таблицы стилей, но я не мог сказать, правильно ли это/рекомендовано или хорошо обходное решение.