Forum | Najnowsze tutoriale tworzenie stron internetowych
 

Bootstrap CSS Typografia referencyjny


Bootstrap's Ustawienia domyślne

Bootstrap's globalny domyślny font-size jest 14px, z line-height o 1.428.

Jest stosowana do <body> i wszystkich punktach.

Ponadto, wszystkie <p> elementy mają dolny margines, która jest równa połowie ich komputerowej line-height (10px domyślnie).


Typografia

Poniższe elementy są elementy HTML, które zostaną urządzone trochę inaczej Bootstrap niż domyślne przeglądarki. Spójrz na "Try it" przykładów, aby zobaczyć wynik / różnice.

Poniższe klasy służy projektować elementy dalej.

Element / Klasa Opis Przykład
<h1> - <h6>
or
.h1 - .h6
h1 - h6 Nagłówki Spróbuj
<small> Tworzy lżejsze, tekst wtórnego w dowolnej pozycji

Nagłówek (tekst wtórny)

Spróbuj
.small Wskazuje mniejszą TEXT (85% wielkości rodzica) mniejszy tekst Spróbuj
.lead Tworzy tekst wyróżniać: Stojak na tekst Spróbuj
<mark>
or
.mark
Tekst Highlights: Zaznaczony tekst Spróbuj
<del> Wskazuje usunięty tekst: Usunięty tekst Spróbuj
<s> Wskazuje już odpowiedni tekst: Nie ma już znaczenia tekstu Spróbuj
<ins> Wskazuje wstawiony tekst: wstawiony tekst Spróbuj
<u> Wskazuje, podkreślony tekst: podkreślony tekst Spróbuj
<strong> Wskazuje pogrubiony tekst: Tekst pogrubiony Spróbuj
<em> Wskazuje tekst kursywą: text Kursywa Spróbuj
.text-left Wskazuje tekst wyrównany do lewej Spróbuj
.text-center Wskazuje tekst wyśrodkowany Spróbuj
.text-right Wskazuje tekst wyrównany do prawej Spróbuj
.text-justify Wskazuje tekst wyjustowany Spróbuj
.text-nowrap Wskazuje na brak zawijania tekstu Spróbuj
.text-lowercase Wskazuje tekst małe litery: małe litery TEKST Spróbuj
.text-uppercase Wskazuje tekst duże litery: duże litery tekstu Spróbuj
.text-capitalize Wskazuje tekst skapitalizowanych: text skapitalizowane Spróbuj
<abbr> <abbr> Element wskazuje skrót lub akronim. Skróty z tytułu atrybut posiada dolną granicę przerywana, a kursor pomocy przy aktywowaniu, zapewniając dodatkowy kontekst przy aktywowaniu. Spróbuj
.initialism Wyświetla tekst wewnątrz <abbr> elementu w nieco mniejszym rozmiarze czcionki Spróbuj
<address> Przedstawia informacje kontaktowe Spróbuj
<blockquote> Wskazuje bloki zawartości z innego źródła Spróbuj
.blockquote-reverse Wskazuje blockquote z zawartością prawej wyrównany Spróbuj
<ul> Wskazuje listę nieuporządkowaną Spróbuj
<ol> Wskazuje uporządkowaną listę Spróbuj
.list-unstyled Usuwa domyślnego list-style i lewy margines elementów listy (działa zarówno <ul> i <ol> ). Ta klasa ma zastosowanie wyłącznie do bezpośrednich elementów listy dzieci (w celu usunięcia domyślnej listy stylu od wszelkich zagnieżdżonych listach, zastosować tę klasę do jakichkolwiek zagnieżdżonych listach, jak również) Spróbuj
.list-inline Miejsca wszystkie elementy listy w jednej linii Spróbuj
<dl> Wskazuje listę opis Spróbuj
.dl-horizontal Linie up terminów i opisów w <dl> elementu side-by-side. Zaczyna się jak domyślnie <dl>s , ale gdy okno przeglądarki rozszerza, to w kolejce side-by-side Spróbuj

Kod

Element / Klasa Opis Przykład
<var> Wskazuje zmienne: x = a b + y Spróbuj
<kbd> Wskazuje, że wejście jest zwykle wprowadzane z klawiatury: CTRL + P Spróbuj
<pre> Wskazuje wiele linii kodu Spróbuj
<pre class="pre-scrollable"> Wskazuje wiele linii kodu z paska przewijania Spróbuj
<samp> Wskazuje Przykładowe wyjście z programu komputerowego: Przykładowe wyjście Spróbuj
<code> Wskazuje inline fragmenty kodu: span , div Spróbuj