Sergo Skiller

Как работает адаптивность в Bootstrap?

Recommended Posts

Заинтересовался адаптивными сайтами на Bootstrap.

 

И вот меня интересует такой вопрос: с помощью чего (каких правил CSS и т.д.) при разных размерах экранов появляются одни объекты (слои) и скрываются другие. Погуглил, но ничего дельного не нашел, мб не так гуглил. :))

 

Меня интересует код, если кто-то подскажет буду благодарен.

 

P.S.: На сколько я знаю все сделано без использования JS, на чистом CSS и HTML.

 

 

 

s_1423747388_1765938_6e1b43486d.pngs_1423747174_7758626_b0dab5ca2b.png

Share this post


Link to post
Share on other sites

Там строится сетка , но я переопределял и блок не уезжал друг под друга

А вообще если хотите отображения на всех устройствах одинаково то используйте col-xs  мобильные устройства

Edited by Romasa

Share this post


Link to post
Share on other sites

Там строится сетка , но я переопределял и блок не уезжал друг под друга

А вообще если хотите отображения на всех устройствах одинаково то используйте col-xs  мобильные устройства

Благодарю, я уже разобрался. Сетка как таковая там не обязательна, все можно через медиа-запросы сделать :)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By Tascan
      Всем привет.
      В данный момент изучаю Bootstrap и задался таким вопросом. По правилам сетки Bootstrap, если я не ошибаюсь row и col должны быть внутри элемента с классом container.
      Но вот если при вёрстке макет разделён на отдельные блоки, например: header отдельно, далее ещё пару блоков с информацией и за ним footer. Как при таком варианте правильнее будет сделать порядок: общий тег container, вместо стандартного wrapper и далее внутри него все вышеперечисленные теги или же нужно создать container для каждого раздела?
      А если, например, у каждого из этих разделов свой фон? Тогда уже нужно идти по второму варианту: делать разделы на 100% ширину браузера, прописывать им фон, а вот внутри них уже делать div'ы с классом container, которые уже ограничат ширину блоков с контентом? 
    • By vka986
      Здравствуйте, я начинающий верстальщик, только учусь сейчас изучаю технологию Bootstrap и у меня возникла проблема, есть три блока с контентом, каждый занимает по 4 колонки то есть использую col-md-4, в сетке бутстрапа в макете все отлично сходиться вместе с 20px margin-right, но в верстке как только в CSS пишу margin  хотя бы 1 px, последний блок сезжает на строчку ниже. Подскажите как с этим быть заранее спасибо.
    • By toplife
      Интернет-маркетинговое агентство Top-Life. Мы ищем в команду Junior Web разработчика.
       
      Что мы ожидаем от кандидата:
      Навыки HTML5, CSS3, JavaScript; Знания PHP5-7‚ MySQL‚ jQuery, ajax; Опыт в верстке; Наличие опыта разработки и знание различных CMS (1С Битрикс, UMI, ModX, WordPress и другие) будет плюсом; Опыт работы и наличие портфолио приветствуется; Умение и желание работать в команде; Аккуратность (осмысленность) в работе.  
      Задачи, которые вам предстоит решать:
      Современная адаптивная кроссбраузерная верстка (HTML5+CSS3); Применение готовой верстки к CMS (1С-Битрикс, Wordpress);  
      Условия:
      Оформление по ТК РФ Заработная плата: от 20 000 до 40 000 руб;  График работы: 5/2 с 10.00–19.00, обед с 14.00–15.00; На территории работодателя; Молодой‚ профессиональный коллектив; Корпоративные мероприятия; Чай, кофе и печеньки с нас; Мы даем возможность не просто работать‚ а создавать и развиваться. Для связи:
      Антон
      тел: 8(981)897-42-46
      mail: a.majstrenko@top-life.su
      hh: https://spb.hh.ru/vacancy/30397980
  • Member Statistics

    46,502
    Total Members
    3,128
    Most Online
    JamesAPatel
    Newest Member
    JamesAPatel
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.