Матн

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

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

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

Баъзе матни ҷойнишин барои нишон додани ҳамоҳангии асосноки матн. Оё шумо барои ман низ ҳамин тавр мекунед? Вақти он расидааст, ки бо мусиқӣ рӯбарӯ шавам, ки ман дигар музеи ту нестам. Шунидам, ки ин зебост, судя бошед ва духтарони ман овоз медиҳанд. Ман дар даруни худ фениксро ҳис мекунам. Бихишт ба ишки мо хасад мекунад, Аз боло фариштахо мегирянд. Бале, шумо маро ба утопия мебаред.

<p class="text-justify">Some placeholder text to demonstrate justified text alignment. Will you do the same for me? It's time to face the music I'm no longer your muse. Heard it's beautiful, be the judge and my girls gonna take a vote. I can feel a phoenix inside of me. Heaven is jealous of our love, angels are crying from up above. Yeah, you take me to utopia.</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танзим word-wrap: break-wordва word-break: break-word. Мо word-wrapба ҷои маъмултарин overflow-wrapбарои дастгирии васеътари браузер истифода мебарем ва word-break: break-wordбарои пешгирӣ кардани мушкилот бо контейнерҳои flex-ро илова мекунем.

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>