Skip to content

建立 2024-01-01 更新 2026-09-15

文字

文字工具類控制對齊、換行、粗細、大小寫與截斷,對應官方 Text。標題大小另外看 Typographydisplay-*fs-*

最常用的幾組

<p class="text-center text-md-start">手機置中,平板以上靠左。</p>
<p class="fw-bold">粗體</p>
<p class="fst-italic text-muted">斜體、較淡的輔助文字(5.3 起較建議 text-body-secondary)。</p>
<p class="text-truncate" style="max-width: 12rem;">太長的一行會被切掉並顯示省略號</p>
class 作用
text-startcenterend 對齊;可加斷點如 text-md-center
fw-boldfw-semiboldfw-light 字重
fs-1fs-6 字級(1 最大)
text-uppercaselowercasecapitalize 大小寫
text-truncate 單行省略,父層要有寬度
lh-smlh-lg 行高

標題語意仍用 h1h6;只想「看起來像標題」才用 h1h6 class 或 display-1

推薦影音

來源:The Net Ninja 約 10 分鐘

同一支片講顏色與 typography,對應本頁與 顏色