Bootstrap 3 之 Bootstrap 辅助类

Bootstrap 提供了一系列辅助类,用于快速调整元素的样式和布局。这些辅助类可以帮助我们快速实现一些常见的样式需求,而不需要编写额外的 CSS。

文本对齐

Bootstrap 提供了以下几个类来调整文本的对齐方式:

  • .text-left:左对齐
  • .text-center:居中对齐
  • .text-right:右对齐
  • .text-justify:两端对齐
  • .text-nowrap:禁止换行

示例代码:

---- -----------------------------
---- --------------------------------
---- ------------------------------
---- ---------------------------------
---- --------------------------------

文本颜色

Bootstrap 提供了一系列类来调整文本的颜色:

  • .text-primary:主题色
  • .text-secondary:次要色
  • .text-success:成功色
  • .text-danger:危险色
  • .text-warning:警告色
  • .text-info:信息色
  • .text-light:浅色
  • .text-dark:深色
  • .text-muted:禁用色

示例代码:

----- ---------------------------------
----- -----------------------------------
----- ---------------------------------
----- --------------------------------
----- ---------------------------------
----- ------------------------------
----- ------------------------------
----- -----------------------------
----- -------------------------------

背景颜色

Bootstrap 还提供了一系列类来调整元素的背景颜色:

  • .bg-primary:主题色背景
  • .bg-secondary:次要色背景
  • .bg-success:成功色背景
  • .bg-danger:危险色背景
  • .bg-warning:警告色背景
  • .bg-info:信息色背景
  • .bg-light:浅色背景
  • .bg-dark:深色背景

示例代码:

---- ----------------- -----------------------
---- ------------------- -----------------------
---- ----------------- -----------------------
---- ---------------- -----------------------
---- ----------------- -----------------------
---- -------------- -----------------------
---- ---------------------------
---- -------------- ----------------------

通过使用这些辅助类,我们可以快速地调整文本和背景的样式,使页面看起来更加美观和易读。在实际项目中,可以根据需要灵活运用这些辅助类来实现自己想要的效果。


上一篇:Bootstrap 图片
下一篇:Bootstrap 响应式实用工具