2

Возможно ли как то отключить адаптацию к экрану если человек увеличивает (zoom'ит) сайт в браузере? Изначально он подстраивается под ширину экрана. Конечно можно было бы попыхтеть что бы он идеально смотрелся на всех экранах, но сайт слишком перенасыщен колонками. В общем нужно что бы если человек увеличивает в процентах zoom то сайт увеличивался целиком как обычный сайт с фиксированной шириной. Что бы увеличивалось просто пропорционально все, будто он не адаптивный. Как stackoverflow когда его зумишь на компьютере.

2 ответа 2

3

Это русский stackowerflow, так что вот конкретное решение:

1) Нужно убрать мета-тэг:

<meta name="viewport" content="width=device-width, initial-scale=1">

2) Необходимо поменять ширину класса .container
    Это можно сделать следующим образом

.container{
    width:960px !important;
}

3) Везде в сетке используйте класс .col-xs-


P.S. Важный момент заданный стиль должен затирать родной стиль bootsrap. Удачного кодинга...

0

Официальная документация

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.

  1. Убрать тег:

    <meta name="viewport" content="width=device-width, initial-scale=1">

  2. Переопределить класс, можно без !important, придется поиграться со специфичностью..

    .container { width: 970px !important; }

  3. Если используется navbar (меню) то требуется удалить классы для поведения "collapse". (В данном случае видимо это лишнее)

  4. Классы колонок, col-lg-, col-md-, col-sm-, заменить на .col-xs-

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.