Настроить бутстрап на ширину 960 пикселей

Question

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

У меня есть идея, но я не уверен, что это правильный способ сделать это. Могу ли я просто создать новый «custom.css» документ и отредактировать класс .container до 960px?

Заранее благодарен, Ричард.

Answer 1

В bootstrap, по умолчанию: класс контейнера имеет следующее значение max-width, указанное в запросе на медиа.

@media (min-width: 768px){ 
    .container{ 
    max-width:750px; 
    } 
} 

@media (min-width: 992px){ 
    .container{ 
    max-width:970px; 
    } 
} 

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

Чтобы изменить это добавить следующие правила таблицы стилей custom.css (Убедитесь, что ваша таблица стилей custom.css загружается после начальной загрузки таблицы стилей bootstrap.min.css):

@media (min-width: 992px){ 
    .container{ 
    max-width:960px; 
    } 
} 

@media (min-width: 1200px){ 
    .container{ 
    max-width:960px; 
    } 
} 

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

Ниже приведен список параметров сетки по умолчанию с помощью бутстрапа.

http://getbootstrap.com/css/#grid-options

Answer 2

Вы можете свободно настроить систему сетки в boostrap следовать на домашней странице boostrap: http://getbootstrap.com/customize/#media-queries-breakpoints.