Как скрыть элементы в Bootstrap | Классы .hidden и .visible

Как скрыть элементы в Bootstrap | Классы .hidden и .visible
HTML и CSS 0    1089 0

Bootstrap 3 содержит адаптивные (служебные) классы, которые позволяют управлять видимостью отображения элементов в зависимости от типа устройства.

Phones (<768px) Tablets (≥ 768px) Desktops (≥ 992px) Desktops (≥ 1200px)
.visible-xs-? Видимый Скрытый Скрытый Скрытый
.visible-sm-? Скрытый Видимый Скрытый Скрытый
.visible-md-? Скрытый Скрытый Видимый Скрытый
.visible-lg-? Скрытый Скрытый Скрытый Видимый

Вместо знака ? необходимо указать block, inline или inline-block. Т.е. указать, как данный элемент должен отображаться.

Phones (<768px) Tablets (≥ 768px) Desktops (≥ 992px) Desktops (≥ 1200px)
.hidden-xs Скрытый Видимый Видимый Видимый
.hidden-sm Видимый Скрытый Видимый Видимый
.hidden-md Видимый Видимый Скрытый Видимый
.hidden-lg Видимый Видимый Видимый Скрытый

Рекомендую отличный хостинг
Просят от 5 рублей в день
  • PHP 4/5/7, Perl 5, Python, Zend, phpMyAdmin;
  • SSH, sFTP/FTP доступ;
  • Возможность заказа дополнительных IP-адресов;
  • POP3, IMAP, SMTP для работы с почтой;
  • Неограниченное количество доменов и поддоменов;
  • Неограниченный трафик;
  • Автоматическая установка CMS;
  • Управление DNS-записями;
  • И еще много разных ништяков 😉
Протестировать (30 дней бесплатно)

Cмотрю на свой контент и думаю: стал бы я сам делиться им с друзьями?


Похожие статьи:

Подборка слайдеров для сайта на чистом CSS
Кнопка для сайта в стиле минимализм
Градиент для кнопок на сайте
3D текст с мультяшным эффектом на CSS
CSS анимация в стиле рентгена
Верстка блоков со стрелочками
Анимированный фон с плавающими облаками
Красивое оформление 404 страницы
Вертикальное hover hide меню для сайта на HTML и CSS
Стилизация Input File

Комментарии ()

    Вы должны авторизоваться, чтобы оставлять комментарии.

    Вы можете авторизоваться на сайте через:
    YandexVkontakte