Panels
Ein Panel in Bootstrap ist ein umrandeten Feld mit einigen Polsterung um seinen Inhalt:
Die Platten werden mit der erstellten .panel Klasse, und der Inhalt im Paneel hat einen .panel-body
Beispiel
<div class="panel panel-default">
<div class="panel-body">A Basic
Panel</div>
</div>
Versuch es selber " Die .panel-default - Klasse wird verwendet , um die Farbe der Platte zu gestalten. Sehen Sie das letzte Beispiel auf dieser Seite für mehr Kontextklassen.
Panel-Überschrift
Die .panel-heading Klasse fügt eine Überschrift der Platte:
Beispiel
<div class="panel panel-default">
<div
class="panel-heading">Panel Heading</div>
<div class="panel-body">Panel
Content</div>
</div>
Versuch es selber " Panel-Footer
Die .panel-footer - Klasse fügt eine Fußzeile auf der Platte:
Beispiel
<div class="panel panel-default">
<div class="panel-body">Panel
Content</div>
<div class="panel-footer">Panel Footer</div>
</div>
Versuch es selber " Panel Group
So gruppieren viele Platten zusammen, wickeln Sie ein <div> mit Klasse .panel-group um sie herum.
Die .panel-group Klasse löscht den unteren Rand jeder Platte:
Beispiel
<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>
Versuch es selber " Panels mit Kontext-bezogene Klassen
Um die Panel - Farbe, verwenden Sie Kontextklassen ( .panel-default , .panel-primary , .panel-success , .panel-info , .panel-warning oder .panel-danger ):
Beispiel
Testen Sie sich mit Übungen!
Übung 1 » Übung 2» Übung 3 » Übung 4» Übung 5 »