- Адаптировал: irbees2008
- Уровень сложности исполнения: это делается простым копированием и нажиманием кнопки
Всем привет, вот нашел нужную мне фишку,поскольку на некоторых проектах используется Bootstrap 3, вот и пришлось публиковать в Bootstrap 4. И там мне понадобилось спрятать блоки на мобилках. Это значит надо спрятать блоки div на маленьких экранах ,с расширение ниже <768px . Мне подадобилось спрятать не нужные блоки в сайтбаре , поскольку они мешали нормальной загрузке основного контента.
В Bootstrap 2 использовались классы .hidden-phone, .hidden-tablet и т.д. Как вы поняли они устарели, и в Bootstrap 3 не работают.
Так вот в Bootstrap 3 используют вот эти классы
1.Мобильные устройства (<768px) — .visible-xs, .hidden-xs
2.Планшеты (768px — 992px) — .visible-sm, .hidden-sm
3.Десктопы (992px — 1200px) — .visible-md, .hidden-md
4.Большие экраны (>1200px) — .visible-lg, .hidden-lg
Ну и пример
<div class='hidden-xs hidden-sm'>
<div class='bаg-image>...</div>
</div>
Можешь почитать и вот эту статейку "Хак- Для тех у кого тёмный фон."
Это тоже интересно
- 25.10.14 Лайтбокс эффект для Bootstrap
- 11.06.18Bootstrap 4 - Таймлайн
- 17.06.18Заголовок или логотип?
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.