Хаки и Скрипты Next Generation CMS

Спрятать блок на мобилках

irbees2008 irbees2008 Опубликовано - 27 - января Bootstrap 4
510 - 0
  • Адаптировал: 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>

Можешь почитать и вот эту статейку "Подсказки qTip"

Опрос

Ваше мнение

TWIG -что это?
Результаты

Последние комментарии

Теги

Anything in here will be replaced on browsers that support the canvas element

Статистика

  • Caйту: 3317 дней
  • Новостей: 542
  • Комменты: 254
  • Зарегистрированно : 570
  • Онлайн всего: [4]
  • Гости: [4]
  • Были сегодня : [2] Яндекс, Google
  • SQL запросов: 33
  • Генерация страницы: 0.165сек
  • Потребление памяти: 4.935 Mb 
  •   яндекс.ћетрика