Bootstrap предоставляет несколько полезных вспомогательных классов для ускорения разработки мобильных приложений. Они могут использоваться для отображения и скрытия содержимого с помощью медиа-запроса в сочетании с большими, малыми и средними устройствами.
Используйте их экономно и избегайте создания совершенно разных версий одного и того же сайта. Ревизионные утилиты в настоящее время доступны только для переключения блоков и таблиц.
Классы | Устройства |
---|---|
.visible-xs | Очень мелкий (менее 768px) видно |
.visible-sm | Небольшие (до 768 пикселей) видимые |
.visible-md | Средний (768 пикс 991 пикселей) видно |
.visible-lg | Изображение большего размера (992 точек и выше) видно |
.hidden-xs | Очень маленький (менее 768 пикселей) скрытый |
.hidden-sm | Маленький (до 768 пикселей) скрытый |
.hidden-md | Средний (768 px до 991 px) скрыт |
.hidden-lg | Большие (992 px и выше) скрыты |
Классы печати
В следующей таблице перечислены классы печати. Используйте их для переключения содержимого для печати.
Классы | Вывод на печать |
---|---|
.visible-print | Да Видимый |
.hidden-print | Видно только для браузера, чтобы не печатать. |
Следующий пример демонстрирует использование вышеперечисленных вспомогательных классов. Измените размер браузера или загрузите пример на разных устройствах, чтобы протестировать эти полезные классы.
Понравилась статья? Поделитесь ею с друзьями и напишите отзыв в комментариях!
Новые статьи
- Бутстрап – Wells - 22/09/2018 17:27
- Бутстрап - Панели - 22/09/2018 17:26
- Bootstrap - Список групп - 22/09/2018 17:26
- Bootstrap - Объект мультимедиа - 22/09/2018 17:25
- Бутстрап - Индикатор прогресса - 22/09/2018 17:25
- Бутстрап - Оповещения - 22/09/2018 17:24
- Bootstrap - Миниатюры - 22/09/2018 17:24
- Bootstrap - Заголовок страницы - 22/09/2018 17:23
- Бутстрап - Jumbotron - карточка статьи - 22/09/2018 17:23
- Бутстрап - Значки - 22/09/2018 17:23
- Бутстрап - Ярлыки - 22/09/2018 17:22
- Бутстрап - Пагинация - разбиение на страницы - 22/09/2018 17:20
- Bootstrap - Breadcrumb - хлебные крошки - 22/09/2018 17:20
- Bootstrap - Navbar - 22/09/2018 17:18
- Бутстрап - Элементы навигации - 22/09/2018 17:17
- Bootstrap - Группы ввода - 22/09/2018 17:17
- Bootstrap - Выпадающие окна и кнопки - 22/09/2018 17:16
- Bootstrap - Группы загрузки - кнопки - 22/09/2018 17:16
- Бутстрап - Выпадающие окна - 22/09/2018 17:15
- Бутстрап - Глификон - 22/09/2018 17:15
Предыдущие статьи
- Bootstrap - Вспомогательные классы - 22/09/2018 17:14
- Bootstrap - Изображения - 22/09/2018 17:13
- Бутстрап - Кнопки - 22/09/2018 17:13
- Бутстрап - Формы - 22/09/2018 17:12
- Бутстрап - Таблицы - 22/09/2018 17:12
- Бутстрап - Вставка кода - 22/09/2018 17:11
- Бутстрап - Типография - 22/09/2018 17:10
- Bootstrap - Обзор CSS - 22/09/2018 17:10
- Бутстрап - Сетка - 22/09/2018 17:09
- Bootstrap - Настройка среды - 22/09/2018 17:09
- Bootstrap - Обзор - 22/09/2018 17:08
- Bootstrap 3. Адаптивные изображения, различные типы меню, формы в меню. Часть 3 - 31/12/2017 16:54
- Bootstrap 3. Типография - заголовки, цитаты, списки, работа с текстом. Часть 2 - 23/12/2017 20:44
- Подключение фреймворка Bootstrap 3 к сайту. Основы сетки шаблона. Часть 1 - 15/12/2017 15:47