טוען...

מעבר למצב חשוך

מעבר למצב בהיר

מעבר מימין לשמאל

מעבר משאל לימין

הגדרות

Text
Text alignment
עותק
<h6 class="text-start text-primary">Left aligned text</h6><h6 class="text-center text-success">Center aligned text</h6><h6 class="text-end text-info">Right aligned text</h6>
Left aligned text
Center aligned text
Right aligned text
Text wrapping
עותק
<div class="badge bg-primary text-wrap">This text should wrap.</div>
This text should wrap.
Text overflow
עותק
<div class="text-nowrap">This text should overflow the parent.</div>
This text should overflow the parent.
Text transform
עותק
<h6 class="text-lowercase">Lowercased text.</h6><h6 class="text-uppercase">Uppercased text.</h6><h6 class="text-capitalize">CapiTaliZed text.</h6>
Lowercased text.
Uppercased text.
CapiTaliZed text.
Font weight and italics
עותק
<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><p class="font-normal">Text without font style</p>

Bold text.

Bolder weight text (relative to the parent element).

Normal weight text.

Light weight text.

Lighter weight text (relative to the parent element).

Italic text.

Text without font style

Line height
עותק
<p class="lh-1">...</p><p class="lh-sm">...</p><p class="lh-base">...</p><p class="lh-lg">...</p>

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec sed odio dui. Cras mattis pannenkoek purus.

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec sed odio dui. Cras mattis pannenkoek purus.

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec sed odio dui. Cras mattis pannenkoek purus.

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec sed odio dui. Cras mattis pannenkoek purus.

Text decoration
עותק
<p class="text-decoration-underline">This text has a line underneath it.</p><p class="text-decoration-line-through">This text has a line going through it.</p><a class="text-decoration-none" href="#">This link has its text decoration removed</a>

This text has a line underneath it.

This text has a line going through it.

This link has its text decoration removed