Darstellung eines 4-spaltigen Aufmachers
Dieser Aufmacher wurde als einspaltiger Aufmacher angelegt. Durch eine erweiterte Eigenschaft wird dieser in Spalten aufgeteilt. Somit bietet Ihnen der Aufmacher noch mehr Möglichkeiten in shop- und web to date als je zuvor. Wie die „normalen Aufmacher“ dargestellt werden sehen Sie hier
.
Aufgrund des Grid-Systems des Designs sind 2, 3, 4, 6 oder 12 spaltige Aufmacher möglich, die als „einspaltiger Aufmacher“ angelegt wurden. Zusätzlich ist es Möglich die Ausrichtung die Ausrichtung und Größe der Nummerierungen pro Aufmacher zu wählen und für die weiterführenden Links können Sie Klassen vergeben, damit ist die Erstellung der folgenden Button-Stile möglich (abhängig von der gewählten Variante).
Ein Aufmacher mit 2 Spalten könnte natürlich auch über die normale Aufmacherfunktion in 2 Spalten geteilt werden, aber die Konfiguration ist aufwendiger. Außerdem wird bei der Erstellung über den einspaltigen Aufmacher das Bild in der maximal zur Verfügung stehenden Breite generiert.
Für die Darstellung wurde der folgende Code verwendet für Sie als Anwender des Bootstrap-Designs sit nur der Inhalt von class="" wichtig. Die Eingabe von btn btn-primary bei der erweiterten Eigenschaft bewirkt also die Darstellung eines blauen Buttons beziehungsweise Links.
<button type="button" class="btn btn-primary">Primary</button> <button type="button" class="btn btn-success">Success</button> <button type="button" class="btn btn-info">Info</button> <button type="button" class="btn btn-warning">Warning</button> <button type="button" class="btn btn-danger">Danger</button> <button type="button" class="btn btn-link">Link</button>
Zusätzlich kann die Höhe der Schaltfläche bestimmt werden. Möglich sind btn-lg große Schaltfläche, btn-sm kleine Schaltfläche und btn-cx für eine sehr kleine Schaltfläche.
<button type="button" class="btn btn-primary btn-lg">Large button</button> <button type="button" class="btn btn-primary">Default button</button> <button type="button" class="btn btn-primary btn-sm">Small button</button> <button type="button" class="btn btn-primary btn-xs">Mini button</button>
