Bootstrap 5 Metin/Tarz

Bootstrap 5 varsayılan ayarları

Bootstrap 5 varsayılan font-size 1rem olarak ayarlanmıştır (varsayılan olarak 16px),line-height 1.5 olarak ayarlanmıştır.

Ayrıca, tüm <p> öğeleri ayarlar margin-top: 0 ve margin-bottom: 1rem varsayılan olarak 16px).

<h1> - <h6>

Bootstrap 5, HTML başlıklarını (<h1> ile <h6>daha kalın font-weight ve uydu font-size ile stil ayarları kullanabilirsiniz.

Örnek

Kişisel olarak deneyin

Gerekirse, diğer öğeler üzerinde de .h1 ile .h6 sınıfları, onları başlık olarak gösterecek şekilde ayarlar:

Örnek

<p class="h1">h1 Bootstrap başlık</p>
<p class="h2">h2 Bootstrap başlık</p>
<p class="h3">h3 Bootstrap başlık</p>
<p class="h4">h4 Bootstrap başlık</p>
<p class="h5">h5 Bootstrap başlık</p>
<p class="h6">h6 Bootstrap başlık</p>

Kişisel olarak deneyin

display başlıkları

display başlıkları, daha belirgin (daha büyük font-size ve daha ince font-weight) olmaları için kullanılır, altı sınıf seçilebilir:.display-1 ile .display-6:

Örnek

Kişisel olarak deneyin

<small>

Bootstrap 5'te, HTML <small> öğesi (ve .small Bu sınıf, herhangi bir başlıkta küçük yardımcı metin oluşturmak için kullanılır:

Örnek

Kişisel olarak deneyin

<mark>

Bootstrap 5, sarı arka plan rengi ve bazı iç kenar boşlukları ile ayarlar. <mark> ve .mark Tarzı:

Örnek

Kişisel olarak deneyin

<abbr>

Bootstrap 5 HTML'yi aşağıdaki şekilde ayarlar: <abbr> Öğesinin tarzını, alt çizgili kenarlıkla ve farenin üzerinde soru işareti ile belirleyin:

Örnek

Kişisel olarak deneyin

<blockquote>

Diğer kaynaklardan alınan içerik bloklarını alıntıladığınızda, aşağıdaki sınıfı kullanın: .blockquote Sınıf ekleyin <blockquote>Adlandırma yaparken, örneğin 'Dünya Doğa Vakfı'nın web sitesinden', aşağıdaki sınıfı kullanın: .blockquote-footer Sınıf:

Örnek

Kişisel olarak deneyin

<dl>

Bootstrap 5 HTML'yi aşağıdaki şekilde ayarlar: <dl> Öğenin tarzı:

Örnek

Kişisel olarak deneyin

<code>

Bootstrap 5 HTML'yi aşağıdaki şekilde ayarlar: <code> Öğenin tarzı:

Örnek

Kişisel olarak deneyin

<kbd>

Bootstrap 5 HTML'yi aşağıdaki şekilde ayarlar: <kbd> Öğenin tarzı:

Örnek

Kişisel olarak deneyin

<pre>

Bootstrap 5 HTML'yi aşağıdaki şekilde ayarlar: <pre> Öğenin tarzı:

Örnek

Kişisel olarak deneyin

Daha fazla yerleşim sınıfı

Aşağıdaki Bootstrap 5 sınıfları HTML öğesinin tarzına eklenebilir:

Sınıf Açıklama Örnek
.lead Paragrafı vurgular. Bir deneyin
.text-left Metni sola yuvarlar. Bir deneyin
.text-break Uzun metinlerin düzeni bozmamasını önler. Bir deneyin
.text-center Orta yuvarlak metni belirler. Bir deneyin
.text-decoration-none Bağlantı içindeki alt çizgiyi kaldırır. Bir deneyin
.text-end Metni sağa yuvarlar. Bir deneyin
.text-nowrap Metni satır atlamadan belirler. Bir deneyin
.text-lowercase Küçük harf metni belirler. Bir deneyin
.text-uppercase Büyük harf metni belirler. Bir deneyin
.text-capitalize Büyük harf metni belirler. Bir deneyin
.initialism <abbr> öğesi içindeki metni daha küçük bir font ile gösterir. Bir deneyin
.list-unstyled Liste öğelerinin varsayılan list-style ve sol dış kenar boşluğunu kaldırır (ul ve ol için geçerlidir).
Bu tarz yalnızca doğrudan alt liste öğelerine uygulanır.
Herhangi bir iç içe liste'den varsayılan liste tarzını kaldırmak için de bu tarzı iç içe listelere uygular.		 Bir deneyin
.list-inline Tüm liste öğelerini bir satırda gösterir.
Her <li> öğesi ile .list-inline-item birlikte kullanılır.		 Bir deneyin