|
|
Регистрация Восстановить пароль |
Повторная активизация e-mail |
Регистрация | Задать вопрос |
Заплачу за решение |
Новые сообщения |
Сообщения за день |
Расширенный поиск |
Правила |
Всё прочитано |
|
Опции темы | Поиск в этой теме |
23.03.2015, 12:22 | #1 |
Регистрация: 19.08.2013
Сообщений: 5
|
Адаптивная верстка на Бутстрапе
Привет, уважаемые форумчане! Недавно решил освоить бутстрап, и начал верстать под него стандартный двухколоночный макет шириной 980px. Работаю на ноуте, с разрешением 1366*768, колонки создавал с помощью классов col-xs-*, в итоге все хорошо получилось для моего разрешения. Однако при изменении окна браузера до 1024 пикселей в ширину, макет немного деформируется - стандартное бутстраповкое горизонтальное меню не влазит, и один пункт переходит на новую строку, также в некоторых местах возникают искажения из-за слишком больших margin и padding, которые я указывал в абсолютных значениях - px.
Часть проблем с паддингами вылечилась указанием размеров в %, для остальных проблем пришлось писать media query, в частности проблема с меню решилась, когда я для разрешения 1024 px указал паддинги в пунктах меню 10px, вместо прописанных в bootstrap.css 15 px Я новичок в этом деле, и меня терзают сомнения - имея экран 1366 px, наверное с начала верстки, стоило использовать классы col-lg-*, а не col-xs-*? Может есть хорошие примеры верстки конкретных дизайнов под бустрап? |
26.03.2015, 09:50 | #2 | ||
Квадрокоптерист
Участник клуба Подтвердите свой е-майл
Регистрация: 29.09.2007
Сообщений: 1,824
|
Цитата:
Думаю стоит начать отсюда Цитата:
думаю этих шаблонов более чем достаточно чтобы понять принцип. Вы не должны использовать никакие padding и margin и прочее... по английски же написано как нужно действовать Extra small devices Phones (<768px) - .col-xs- Small devices Tablets (≥768px) - .col-sm- Medium devices Desktops (≥992px) - .col-md- Large devices Desktops (≥1200px) -.col-lg- Думаю обучения стоит начать с обучения читать, и все у вас получится.
Я часть той силы, что вечно хочет зла, но вечно совершает благо..
|
||
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Адаптивная верстка | kostya67 | HTML и CSS | 3 | 01.02.2015 10:53 |
Адаптивная верстка сайта | Андрей79 | HTML и CSS | 0 | 05.04.2014 18:16 |
Верстка. | Ast | HTML и CSS | 8 | 06.01.2012 21:19 |
сезонная адаптивная модель в VBA | Kudoh | Microsoft Office Excel | 0 | 18.06.2009 19:31 |