Tekst
Dokumentacija i primjeri uobičajenih tekstualnih uslužnih programa za kontrolu poravnanja, prelamanja, težine i još mnogo toga.
Lako poravnajte tekst sa komponentama pomoću klasa poravnanja teksta.
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 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>Za poravnanje lijevo, desno i po sredini, dostupne su responzivne klase koje koriste iste granične tačke širine prikaza kao i sistem mreže.
Lijevo poravnat tekst na svim veličinama okvira za prikaz.
Centrirano poravnat tekst na svim veličinama okvira za prikaz.
Desno poravnat tekst na svim veličinama okvira za prikaz.
Lijevo poravnat tekst na okvirima za prikaz veličine SM (mali) ili širi.
Lijevo poravnat tekst na okvirima za prikaz veličine MD (srednje) ili šire.
Lijevo poravnat tekst na okvirima za prikaz veličine LG (veliki) ili širi.
Lijevo poravnat tekst na prozorima veličine XL (ekstra-veliki) ili širi.
<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>Spriječite prelamanje teksta .text-nowrapklasom.
<div class="text-nowrap bd-highlight" style="width: 8rem;">
This text should overflow the parent.
</div>Za duži sadržaj možete dodati .text-truncateklasu za skraćenje teksta trotočkom. Zahtijeva display: inline-blockili display: 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>Transformirajte tekst u komponente sa klasama velikih slova.
Tekst malim slovima.
Tekst velikim slovima.
Veliki tekst.
<p class="text-lowercase">Lowercased text.</p>
<p class="text-uppercase">Uppercased text.</p>
<p class="text-capitalize">CapiTaliZed text.</p>Obratite pažnju na to kako text-capitalizese mijenja samo prvo slovo svake riječi, ostavljajući velika i mala slova bez utjecaja.
Brzo promijenite težinu (podebljanost) teksta ili iscrtajte tekst u kurzivu.
Bold text.
Tekst normalne težine.
Lagan tekst.
Kurziv tekst.
<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>Promijenite odabir u naš skup jednorazrednih fontova pomoću .text-monospace.
Ovo je u monoprostoru
<p class="text-monospace">This is in monospace</p>