Текст

Тигезләнүне, төрүне, авырлыкны һәм башкаларны контрольдә тоту өчен гомуми текст ярдәмендә документлар һәм мисаллар.

Текстны тигезләү

Текстны тигезләү класслары булган компонентларга җиңел итеп күчерегез.

Ambitioni dedisse scripsisse iudicaretur. Cras mattis iudicium purus amet fermentum утыра. Donec sed odio operae, eu vulputate felis rhoncus. Элеккеге коммуна. Афрос ситентис пиросында. Диэ сертификат күрсәткечендә Галлиа. Cras mattis iudicium purus 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>

Сул, уң һәм үзәк тигезләү өчен җаваплы класслар бар, алар челтәр системасы белән бер үк күренеш киңлеген кулланалар.

Барлык күренеш зурлыкларында сул тигезләнгән текст.

Viewзәк барлык күренеш үлчәмнәрендә тигезләнгән текст.

Барлык күренеш зурлыкларында дөрес тигезләнгән текст.

СМ (кечкенә) яки киңрәк күренешләрдә сул тигезләнгән текст.

МД (урта) яки киңрәк күренешләрдә сул тигезләнгән текст.

LG (зур) яки киңрәк күренешләрдә сул тигезләнгән текст.

XL зурлыгында (өстәмә зур) яки киңрәк күренешләрдә сул тигезләнгән текст.

<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>

Текстны төрү һәм ташып китү

Текстны .text-nowrapкласс белән төрүдән саклагыз.

Бу текст ата-ананы ташларга тиеш.

<div class="text-nowrap" style="width: 8rem;">
  This text should overflow the parent.
</div>

Озаграк эчтәлек .text-truncateөчен текстны эллипс белән кисәр өчен класс өсти аласыз. Таләп итә display: inline-blockяки 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>

Текстны үзгәртү

Текстны капитализация класслары белән компонентларда үзгәртү.

Түбән текст.

Upperгары текст.

CapiTaliZed тексты.

<p class="text-lowercase">Lowercased text.</p>
<p class="text-uppercase">Uppercased text.</p>
<p class="text-capitalize">CapiTaliZed text.</p>

Игътибар итегез text-capitalize, һәр сүзнең беренче хәрефен ничек үзгәртә, бүтән хәрефләр очраксыз кала.

Шрифт авырлыгы һәм италика

Текстның авырлыгын (кыюлыгын) тиз үзгәртегез яки текстны итализацияләгез.

Калын текст.

Нормаль авырлык тексты.

Lightиңел авырлык тексты.

Италия тексты.

<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>