Bootstrap 5 是一个风行的前端框架，它供给了一系列的帮助类（Utilities Classes），可能帮助开辟者疾速创建呼应式、美不雅的网页计划。这些帮助类涵盖了色彩、空间、字体、间距、对齐等多种款式，极大年夜地进步了网页计划的效力。本文将具体介绍 Bootstrap 5 的帮助类，帮助开辟者更好地利用这些东西。
Bootstrap 5 供给了丰富的色彩帮助类，包含主题色彩、背景色彩跟文本色彩。
<div class="text-primary">这是主题色彩的文本</div>
<div class="bg-primary">这是主题色彩的背景</div>
<div class="text-white bg-secondary">这是背景色彩的文本</div>
<div class="text-success">这是文本色彩的示例</div>
空间帮助类用于在元素四周创建空间，包含高低、阁下、底部空间。
<div class="mt-3">上边距为 3 个单位</div>
<div class="mb-4">下边距为 4 个单位</div>
<div class="ml-5">左边距为 5 个单位</div>
<div class="mr-6">左边距为 6 个单位</div>
<div class="mt-auto">上边距主动</div>
<div class="mb-auto">下边距主动</div>
字体帮助类可能疾速设置字体大小、行高跟字体粗细。
<h1 class="h1">这是 h1 标题标字体大小</h1>
<h2 class="h2">这是 h2 标题标字体大小</h2>
<p class="lh-1">行高为 1</p>
<p class="lh-lg">行高为大年夜号</p>
<p class="fw-bold">字体粗细为加粗</p>
<p class="fw-normal">字体粗细为正常</p>
间距帮助类用于在元素之间创建空间，包含程度间距跟垂直间距。
<div class="ms-2 me-3">阁下间距分辨为 2 个单位跟 3 个单位</div>
<div class="my-4">高低间距为 4 个单位</div>
对齐帮助类用于设置元素的对齐方法，包含文本对齐、内容对齐跟块对齐。
<div class="text-start">文本左对齐</div>
<div class="text-center">文本居中对齐</div>
<div class="text-end">文本右对齐</div>
<div class="align-items-start">垂直偏向内容左对齐</div>
<div class="align-items-center">垂直偏向内容居中对齐</div>
<div class="align-items-end">垂直偏向内容右对齐</div>
<div class="justify-content-start">程度偏向块左对齐</div>
<div class="justify-content-center">程度偏向块居中对齐</div>
<div class="justify-content-end">程度偏向块右对齐</div>
Bootstrap 5 的帮助类为开辟者供给了丰富的款式抉择，极大年夜进步了网页计划的效力。经由过程纯熟控制这些帮助类，开辟者可能疾速创建美不雅、呼应式的网页计划。