Metin
Hizalama, sarma, ağırlık ve daha fazlasını denetlemek için yaygın metin yardımcı programlarına ilişkin belgeler ve örnekler.
Metin hizalama sınıflarıyla metni bileşenlere kolayca yeniden hizalayın.
Ambitioni dedisse scripsisse iudicaretur. Cras mattis iudicium purus sit amet fermentum. Donec sed odio operae, eu vulputate felis rhoncus. Önem arz eden bir durum. Nos hinc posthac'ta, sitientis piros Afros. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Cras mattis iudicium purus sit amet fermentum.
<p class="text-justify">Ambitioni dedisse scripsisse iudicaretur. Cras mattis iudicium purus sit amet fermentum. Donec sed odio operae, eu vulputate felis rhoncus. Praeterea iter est quasdam res quas ex communi. At nos hinc posthac, sitientis piros Afros. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Cras mattis iudicium purus sit amet fermentum.</p>Sola, sağa ve merkeze hizalama için, ızgara sistemiyle aynı görünüm alanı genişliği kesme noktalarını kullanan duyarlı sınıflar mevcuttur.
Tüm görüntü alanı boyutlarında sola hizalanmış metin.
Tüm görüntü alanı boyutlarında ortalanmış metin.
Tüm görüntü alanı boyutlarında sağa hizalanmış metin.
SM (küçük) veya daha geniş görünüm alanlarında sola hizalanmış metin.
MD (orta) veya daha geniş görünüm alanlarında sola hizalanmış metin.
LG (büyük) veya daha geniş görünüm pencerelerinde sola hizalanmış metin.
XL (ekstra büyük) veya daha geniş görünüm alanlarında sola hizalanmış metin.
<p class="text-left">Left aligned text on all viewport sizes.</p>
<p class="text-center">Center aligned text on all viewport sizes.</p>
<p class="text-right">Right aligned text on all viewport sizes.</p>
<p class="text-sm-left">Left aligned text on viewports sized SM (small) or wider.</p>
<p class="text-md-left">Left aligned text on viewports sized MD (medium) or wider.</p>
<p class="text-lg-left">Left aligned text on viewports sized LG (large) or wider.</p>
<p class="text-xl-left">Left aligned text on viewports sized XL (extra-large) or wider.</p>Metnin bir .text-nowrapsınıfla sarılmasını önleyin.
<div class="text-nowrap bd-highlight" style="width: 8rem;">
This text should overflow the parent.
</div>.text-truncateDaha uzun içerik için, metni üç nokta ile kısaltmak için bir sınıf ekleyebilirsiniz . veya gerektirir .display: inline-blockdisplay: block
<!-- Block level -->
<div class="row">
<div class="col-2 text-truncate">
Praeterea iter est quasdam res quas ex communi.
</div>
</div>
<!-- Inline level -->
<span class="d-inline-block text-truncate" style="max-width: 150px;">
Praeterea iter est quasdam res quas ex communi.
</span>Metin büyük harf sınıfları ile bileşenlerdeki metni dönüştürün.
Küçük harfli metin.
Büyük harfli metin.
CapiTaliZed metin.
<p class="text-lowercase">Lowercased text.</p>
<p class="text-uppercase">Uppercased text.</p>
<p class="text-capitalize">CapiTaliZed text.</p>text-capitalizeHer kelimenin sadece ilk harfinin nasıl değiştirildiğini ve diğer harflerin etkilenmediğini unutmayın.
Metnin ağırlığını (kalınlığını) hızla değiştirin veya metni italik yapın.
Kalın yazı.
Normal ağırlık metni.
Hafif metin.
İtalik metin.
<p class="font-weight-bold">Bold text.</p>
<p class="font-weight-normal">Normal weight text.</p>
<p class="font-weight-light">Light weight text.</p>
<p class="font-italic">Italic text.</p>Bir seçimi tek aralıklı yazı tipi yığınımızla değiştirin .text-monospace.
Bu tek uzayda
<p class="text-monospace">This is in monospace</p>