Source

Матн

Ҳуҷҷатҳо ва мисолҳо барои утилитаҳои матнии умумӣ барои назорати ҳамворкунӣ, печондан, вазн ва ғайра.

Ҳамоҳангсозии матн

Матнро ба ҷузъҳо бо синфҳои ҳамоҳангсозии матн ба осонӣ мутобиқ кунед.

Ambitioni dedisse scripsisse iudicaretur. Cras Mattis iudicium purus sit amet fermentum. Donec sed odio operae, eu vulputate felis rhoncus. Пешниҳод аз ҷомеаи пештара. Дар ин ҷост, ки афсӯс аст. 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>

Барои ҳамоҳангсозии чап, рост ва марказ, синфҳои ҷавобӣ мавҷуданд, ки ҳамон нуқтаи кандашавии паҳнои намоишро ҳамчун системаи шабака истифода мебаранд.

Матни ба чап мувофиқшуда дар ҳама андозаи намоишгоҳ.

Матни ба марказ мутобиқ кардашуда дар ҳама андозаҳои намоиш.

Матни ба рост ҳамоҳангшуда дар ҳама андозаҳои намоиш.

Матни ба тарафи чап мувофиқшуда дар намоишгоҳҳои андозаи SM (хурд) ё васеътар.

Матни ба чап мувофиқшуда дар портҳои намоишии андозаи MD (миёна) ё васеътар.

Матни ба чап мувофиқшуда дар намоишгоҳҳои андозаи 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-wrapсинф печонед.

Ин матн бояд печонида шавад. 
<div class="badge badge-primary text-wrap" style="width: 6rem;">
  This text should wrap.
</div>

Аз печонидани матн бо .text-nowrapсинф пешгирӣ кунед.

Ин матн бояд волидайнро пур кунад. 
<div class="text-nowrap bd-highlight" 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>

Танаффус

.text-breakБо истифода аз танзим overflow-wrap: break-word(ва word-break: break-wordбарои мутобиқати IE ва Edge) сатрҳои дарози матнро аз вайрон кардани тарҳбандии ҷузъҳои шумо пешгирӣ кунед .

Mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm

<p class="text-break">mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm</p>

Табдил додани матн

Матнро дар ҷузъҳо бо синфҳои капитализатсияи матн табдил диҳед.

Матни хурд.

Матни калон.

Матни калонҳаҷм.

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

Аҳамият диҳед, ки чӣ гуна .text-capitalizeтанҳо ҳарфи аввали ҳар як калимаро тағир медиҳад ва ҳолати ҳарфҳои дигарро бетаъсир мемонад.

Вазни шрифт ва курсив

Вазни (ҷасурии) матнро зуд тағир диҳед ё матнро курсив кунед.

Матни ғафс.

Матни вазни ғафс (нисбат ба унсури волидайн).

Матни вазни муқаррарӣ.

Матни вазни сабук.

Матни вазни сабуктар (нисбат ба унсури волидайн).

Матни курсив.

<p class="font-weight-bold">Bold text.</p>
<p class="font-weight-bolder">Bolder weight text (relative to the parent element).</p>
<p class="font-weight-normal">Normal weight text.</p>
<p class="font-weight-light">Light weight text.</p>
<p class="font-weight-lighter">Lighter weight text (relative to the parent element).</p>
<p class="font-italic">Italic text.</p>

Монофазо

Интихобро ба стеки шрифти монофосилаи мо бо .text-monospace.

Ин дар як фазо аст

<p class="text-monospace">This is in monospace</p>

Рангро барқарор кунед

Ранги матн ё пайвандро бо - аз нав .text-resetтанзим кунед, то он рангро аз волидайни худ мерос гирад.

Матни хомӯшшуда бо истиноди азнавсозӣ .

<p class="text-muted">
  Muted text with a <a href="#" class="text-reset">reset link</a>.
</p>

Ороиши матн

Ороиши матнро бо .text-decoration-noneсинф хориҷ кунед.

Истиноди зеркашидашуда 
<a href="#" class="text-decoration-none">Non-underlined link</a>