Bootsrtap 3 navbar размеры сворачивания на 1024px?

Question

[Turdex75]

Здравствуйте, ситуация такая есть сайт, задача такая мне нужно чтобы меню превращалось в мобильную версию не на 768px на на 1024px как это сделать?
заранее спасибо!

Answer 1

[devstudent]

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

Comments

[devstudent]

devstudent @devstudent
media (min-width: 768px) {
.navbar-toggle {
display: none;
}
}вот эта запись.
а вы пропишите у себя в цсс
media (min-width: 1025px) {
.navbar-toggle {
display: none;
}

}

Answer 2

[Turdex75]

а можно поподробнее где именно и какие запросы искать

Comments

[devstudent]

какая у вас версия бутстрапа? css используете? или less

[Turdex75]

версия 3 css

[devstudent]

media (min-width: 768px) {
.navbar-toggle {
display: none;
}
}вот эта запись.
а вы пропишите у себя в цсс
media (min-width: 1025px) {
.navbar-toggle {
display: none;
}

}

Answer 3

[crescent]

Заходиш сюда: getbootstrap.com/customize

Находиш раздел:

Grid system
Define your custom responsive grid.

Там есть два поля:
@grid-float-breakpoint: Point at which the navbar becomes uncollapsed.
@grid-float-breakpoint-max: Point at which the navbar begins collapsing.

Меняеш их на свои значения скажем:
@grid-float-breakpoint: 1280px
@grid-float-breakpoint-max:1279px
В это случае будет сворачиваться уже при 1279px;

Генерируеш бутстрап и заменяеш.

Comments

[Turdex75]

Такой вопрос а просто не генерирую можно в стилях медиа запросом прописать ?

[crescent]

можно и я когда то пробывал: но их порядка 100 придется сделать.
если хотите вручную сделая не ломая свой бутстрап, то легче всего делать по следующему алгоритму:

сгенерировать бутстрап со след. настройками:
@grid-float-breakpoint: 777px
@grid-float-breakpoint-max:76px
В сгенерированном документе искать правила в которых есть числа 777 или 776

В своем бутсрапе менять эти правила