Как использовать Twitter Bootstrap 3 для сайта, не отвечающего требованиям?

Как вы можете прочитать на своей странице, новый Bootstrap 3 является "первым мобильным":

С Bootstrap 2 мы добавили дополнительные мобильные стили для ключа аспекты структуры. С помощью Bootstrap 3 мы перезаписали проект будет дружественным для мобильных устройств с самого начала. Вместо добавления дополнительные мобильные стили, , они запекаются прямо в ядро ​​. В Фактически, Bootstrap является мобильным первым. Мобильные первые стили можно найти по всей библиотеке, а не в отдельных файлах.

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

Ответы

Ответ 1

Для более подробной процедуры см. Как использовать Twitter Bootstrap 3 для сайта, не отвечающего требованиям

От Документация по загрузке (плюс некоторые пояснения):

Чтобы отключить чувствительные функции, выполните следующие действия. Смотрите это в действии в измененном шаблоне ниже.

1) Удалить (или просто не добавлять) область просмотра <meta>, упомянутую в документах CSS

само-пояснительная

2) Удалите максимальную ширину на .container для всех уровней сетки с помощью max-width: none! important; и установите правильную ширину, как ширина: 970px;. Убедитесь, что это происходит после CSS Bootstrap по умолчанию. Вы может опционально избегать важного с медиа-запросами или Селектор-фу.

Добавьте этот стиль:

.container{
  max-width: none !important;
  width: 970px;
}

3) Если вы используете navbars, отмените все всплывающие и расширяющие навигационные панели (это слишком много, чтобы показать здесь, поэтому рассмотрим пример).

Откройте variables.less и установите переменные:

@grid-float-breakpoint до 0

@screen-xs-max до 0 (это будет исправлено, прочитайте здесь)

4) Для макетов сетки используйте классы .col-xs- * в дополнение к или вместо средних/больших. Не волнуйтесь, очень маленькое устройство сетка масштабируется до всех разрешений, поэтому вы настроены там.

само-пояснительная

Вам все равно потребуется Respond.js для IE8 (так как наши медиа-запросы все еще там и нужно подбирать). Это просто отключает "мобильный сайт" Bootstrap.

Ответ 4

Ну, я искал то же самое. Я еще не проверил его, поэтому я не могу подтвердить его функциональность, но вот версия с отзывчивым вынимаемым:

https://github.com/bassjobsen/non-responsive-tb3

Ответ 5

Посмотрите здесь ответ Jay Douglass, в котором подробно описываются переменные точки останова медиа-запроса, чтобы отключить чувствительные функции. Это простое решение, требующее минимальных изменений.

Как удалить отзывчивые функции в Twitter Bootstrap 3?

Ответ 6

С небольшим усилием вы можете это достичь.

1) Удалить окно просмотра

2) Добавьте .container{ max-width: none !important; width: 970px; } в ваш файл css

3) Если вы используете navbars, отмените все рушительные и расширяющиеся действия на навигационной панели

4)

Для макетов сетки используйте классы .col-xs- * в дополнение к или в место средних/больших. Не волнуйтесь, очень маленькое устройство сетка масштабируется до всех разрешений, поэтому вы настроены там.

Вы можете перейти по ссылке ниже:

http://getbootstrap.com/getting-started/#disable-responsive