Bootstrap-Layout
Bootstrap mit Helvetica Neue, Helvetica, Arial und serifenlose Schrift als Standard-Stack.
Bootstrap mit einem Seitenlayout-Funktion können Sie erstellen Überschriften, Absätze, Listen und andere Inline-Elemente.
Überschrift
Bootstrap definiert alle HTML-Überschriften (h1 bis h6) Stile. Betrachten Sie die folgenden Beispiele:
Beispiele
Versuchen »
Die Ergebnisse sind wie folgt:
Inline Untertitel
Wenn Sie einen Untertitel hinzufügen müssen einen Titel zu Inline, fügen Sie einfach auf beiden Seiten des Elements <small> oder.small Klasse hinzufügen, diese Weise können Sie eine Größe kleiner heller Textfarbe, wie die folgenden Beispiele erhalten wie folgt:
Beispiele
Versuchen »
Die Ergebnisse sind wie folgt:
Eine Kopie des Führungskörpers
Um einen Absatz hinzuzufügen, Text zu betonen, können Sie class = "lead", fügen die mehr Textzeilenhöhe wird größer und kühner, in den folgenden Beispielen, wie gezeigt:
Beispiele
Versuchen »
Die Ergebnisse sind wie folgt:
betonen
Die Standard-HTML-Tags zu betonen <small> (85% der Eltern setzen die Textgröße des Textes), <strong> (den Text fetter Text), <em> (den Text kursiv).
Bootstrap stellt Klassen verwendet, um Text zu unterstreichen, wie in den folgenden Beispielen gezeigt:
Beispiele
Versuchen »
Die Ergebnisse sind wie folgt:
Abkürzung
HTML - Element - Tag wird für Abkürzungen, wie WWW oder HTTP zur Verfügung gestellt. Bootstrap Definition von <abbr> Element des Stils für an der Unterseite des Rahmens eine gestrichelte Linie in der Anzeige von Text, wenn die Maus über den vollständigen Text angezeigt werden (solange Sie ein <abbr> add title - Attribut Text). Um eine kleinere Schrift Text zu erhalten, fügen Sie .initialism auf <abbr>.
Beispiele
Versuchen »
Die Ergebnisse sind wie folgt:
Adresse (Address)
Verwenden Sie <address> -Tag können Sie die Kontaktinformationen auf der Seite angezeigt werden soll. Da <address> default display: block;, müssen Sie Etiketten zu verwenden, um eine geschlossene Adresse Wrap Text hinzufügen.
Beispiele
Versuchen »
Die Ergebnisse sind wie folgt:
Reference (Blockquote)
Sie können den Standard verwenden <blockquote> neben einem HTML-Text. mitKlasse.pull-rechts rechts Ausrichtbezugselement Weitere Optionen sind das Hinzufügen eines <small> -Tag die Quelle eines Zitats zu identifizieren. Das folgende Beispiel zeigt die folgenden Funktionen:
Beispiele
Versuchen »
Die Ergebnisse sind wie folgt:
Liste
Bootstrap Unterstützung geordnete Listen, ungeordnete Listen und Definitionslisten.
- Geordnete Liste: eine geordnete Liste von Zahlen oder andere Mittel zu Beginn des geordneten Zeichenliste.
- Ungeordnete Liste: unsortierte Liste bezieht sich auf eine Liste in keiner bestimmten Reihenfolge, ist eine Liste von Zahlen mit Schwerpunkt auf traditionellen Stil beginnen.Wenn Sie möchten , diese Betonung nicht angezeigt werden , können Sie dieKlasse.list-Unstyled verwenden , um Stile zu entfernen. Sie können auch dieKlasse.list-Inline - Liste aller Elemente auf der gleichen Linie verwenden.
- Definitionslisten: Bei dieser Art der Liste kann jeder Listenelement enthalten <dt> und <dd> Element.<Dt> im Namen derDefinitionen von Begriffenwie Wörterbuch, das Teil (oder Sätze) ist definiert. Dann <dd> is <dt> Beschreibung. Sie können dieKlassedl-horizontal mit <dl> Zeile Beschreibung nebeneinander angezeigt gehört.
Das folgende Beispiel veranschaulicht diese Art von Listen:
Beispiele
Versuchen »
Die Ergebnisse sind wie folgt:
Mehr Satzklasse
Die folgende Tabelle enthält weitere Beispiele Bootstrap Typografie-Klasse:
| Kategorie | Beschreibung | Beispiele |
|---|---|---|
| .Lead | Markieren Sie den Absatz zu machen | versuchen |
| .small | Einstellen kleinen Text (etwa 85% der Größe des Mutter Text) | versuchen |
| .text-links | Stellen linksbündiger Text | versuchen |
| .text-Zentrum | Einstellen Text ausrichten | versuchen |
| .text-Recht | Festlegen der Text Rechts ausrichten | versuchen |
| .text-rechtfertigen | Festlegen der Textausrichtung, Absätze über den Bildschirm hinaus einige Textumbruch | versuchen |
| .text-nowrap | Absatz über den Bildschirm teilweise wickeln | versuchen |
| .text-Klein | Festlegen von Textklein | versuchen |
| .text-Groß | Festlegen von Textgroß | versuchen |
| .text-Kapital | Einstellen Wort Initialen | versuchen |
| .initialism | Es ist in der <abbr> -Element in dem Text angezeigt kleine Schriftarten angezeigt werden | versuchen |
| .blockquote-Rückwärts | Festlegen einer Referenz auf eine rechtsbündig | versuchen |
| .list-unstyled | Entfernen Sie die Standardliste Stil, Listenelemente linksbündig (<ul> und <ol> in). Diese Kategorie gilt nur das Kind Liste der Elemente zu lenken (wenn Sie eine verschachtelte Liste Elemente zu entfernen müssen, müssen Sie den Stil in einer verschachtelten Liste zu verwenden) | versuchen |
| .list-inline | Wird auf der gleichen Linie alle Listenelemente platziert werden | versuchen |
| .dl-Horizontal | Diese Klasse setzt den Schwimmer und Offset angewendet <dl> -Element und das <dt> Element, können Sie die spezifischen Ausführungsbeispiele sehen | versuchen |
| .pre-scrollbaren | So <pre> Element scrollbaren scrollbaren | versuchen |