Панели
Панель в загрузчиком является Окаймленный коробка с некоторой отступов вокруг его содержание:
Панели создаются с .panel класса, и содержание внутри панели имеет .panel-body класса:
пример
<div class="panel panel-default">
<div class="panel-body">A Basic
Panel</div>
</div>
Попробуй сам " .panel-default класс используется для стиля цвет панели. Смотрите последний пример на этой странице для более контекстных классов.
Группа Heading
.panel-heading класса добавляет заголовок к панели:
пример
<div class="panel panel-default">
<div
class="panel-heading">Panel Heading</div>
<div class="panel-body">Panel
Content</div>
</div>
Попробуй сам " Группа Footer
.panel-footer класс добавляет колонтитула к панели:
пример
<div class="panel panel-default">
<div class="panel-body">Panel
Content</div>
<div class="panel-footer">Panel Footer</div>
</div>
Попробуй сам " Panel Group
Группировка многих панелей вместе, обернуть <div> с классом .panel-group вокруг них.
.panel-group класс очищает нижний край каждой панели:
пример
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-body">Panel
Content</div>
</div>
<div class="panel panel-default">
<div class="panel-body">Panel
Content</div>
</div>
</div>
Попробуй сам " Панели с Контекстные классов
Чтобы цвет панели, используйте контекстные классы ( .panel-default , .panel-primary , .panel-success , .panel-info , .panel-warning или .panel-danger ):
пример
Проверьте себя с упражнениями!
Упражнение 1 » Упражнение 2» Упражнение 3 » Упражнение 4» Упражнение 5 »