Возможно ли как то отключить адаптацию к экрану если человек увеличивает (zoom'ит) сайт в браузере? Изначально он подстраивается под ширину экрана. Конечно можно было бы попыхтеть что бы он идеально смотрелся на всех экранах, но сайт слишком перенасыщен колонками. В общем нужно что бы если человек увеличивает в процентах zoom то сайт увеличивался целиком как обычный сайт с фиксированной шириной. Что бы увеличивалось просто пропорционально все, будто он не адаптивный. Как stackoverflow когда его зумишь на компьютере.
2 ответа
Это русский stackowerflow, так что вот конкретное решение:
1) Нужно убрать мета-тэг:
<meta name="viewport" content="width=device-width, initial-scale=1">
2) Необходимо поменять ширину класса .container
Это можно сделать следующим образом
.container{
width:960px !important;
}
3) Везде в сетке используйте класс .col-xs-
P.S. Важный момент заданный стиль должен затирать родной стиль bootsrap. Удачного кодинга...
Disabling responsiveness
Bootstrap automatically adapts your pages for various screen sizes. Here's how to disable this feature so your page works like this non-responsive example.
Steps to disable page responsiveness:
1. Omit the viewport mentioned in the CSS docs
2. Override the width on the .container for each grid tier with a single width, for example width: 970px !important; Be sure that this comes after the default Bootstrap CSS. You can optionally avoid the !important with media queries or some selector-fu.
3. If using navbars, remove all navbar collapsing and expanding behavior.
4. For grid layouts, use .col-xs-* classes in addition to, or in place of, the medium/large ones. Don't worry, the extra-small device grid scales to all resolutions.
Убрать тег:
<meta name="viewport" content="width=device-width, initial-scale=1">
Переопределить класс, можно без !important, придется поиграться со специфичностью..
.container { width: 970px !important; }
Если используется navbar (меню) то требуется удалить классы для поведения "collapse". (В данном случае видимо это лишнее)
Классы колонок, col-lg-, col-md-, col-sm-, заменить на .col-xs-