Bootstrap 5 Tipps

Letzte Änderung: 13. Januar 2026

Use

justify-content-center

utilities on

Flexbox containers

to change the alignment of flex items. Example: <div class="d-flex justify-content-center">...</div>

mx-auto

for centering

block elements with a defined width, (%, vw, px, etc..)

. Example: <div class="mx-auto w-50">Text</div>

text-center

for center

text and inline elements inside a block element

. Example: <div class="text-center"><span>Text</span></div> and <div class="text-center"><header>Text</header></div>

Reset a text or link’s color with class="text-reset"

Blockquote: class="blockquote"

<p class="fw-bolder">Bolder weight text (relative to the parent element).</p>

<p class="fw-normal">Normal weight text.</p>

<p class="fw-light">Light weight text.</p>

<p class="fw-lighter">Lighter weight text (relative to the parent element).</p>

<p class="fst-italic">Italic text.</p>

<p class="fst-normal">Text with normal font style</p>

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