Bootstrap 3: Как установить сетку по умолчанию на ширину 960 пикселей?

Я работаю с Bootstrap 3, и клиент хочет, чтобы ширина контейнера веб-сайта была установлена равной 960px. Я непосредственно редактирую файл CSS или что это лучший способ сделать это? Я слышал что-то о "Меньше". Я настраиваю загрузку? Спасибо!

Обновление: сайту НЕ нужно быть отзывчивым, поэтому я могу отключить эту отзывчивость и просто добавить ширину 960 пикселей к CSS и выполнить ее или это вызовет проблемы в другом месте?

Ответы

Ответ 1

Для Bootstrap3 вы можете настроить его для получения 960px по умолчанию (http://getbootstrap.com/customize/)

change @container-large-desktop от ((1140px + @grid-gutter-width)) до ((940px + @grid-gutter-width)).
change @grid-gutter-width от 30px до 20px.

затем загрузите свою собственную загрузочную загрузку и используйте ее. Теперь по умолчанию должно быть 960 пикселей.

Ответ 2

Я хотел, чтобы максимальная ширина была 810px, поэтому я использовал медиа-запрос, подобный этому:

@media (min-width: 811px) {    
    .container{
        width:810px;
    }
}

Ответ 3

Bootstraps gridsystem - это FLUID. Это означает, что он работает в процентах.

Так что просто установите ширину на обертку страницы, и вы готовы пойти

HTML:

<body>
    <div class="page-wrapper">
        <!-- Your bootstrap grid/page markup here -->
    </div>
</body>

CSS

.page-wrapper {
    width: 960px; /* Your page width */
    margin: 0 auto; /* To center your page within the body */
}

Ответ 4

Самый простой способ - обернуть все в контейнер, подобный этому.

.container-fixed {
  margin: 0 auto;
  max-width: 960px;
}

http://bootply.com/94943

Или вы можете пойти с LESS/custom build: http://getbootstrap.com/customize/