Bootstrap 文本颜色示例

简介

Bootstrap 是一个流行的前端框架，它提供了一系列的 CSS 和 JavaScript 组件，可以快速地搭建网页。其中，文本颜色是一个重要的组成部分，可以让我们更好地展示文本信息。本文将介绍 Bootstrap 中的文本颜色示例。

示例

基础色

Bootstrap 提供了多种基础色，包括 primary、secondary、success、danger、warning、info、light、dark 等。我们可以使用 .text-{color} 类来设置文本颜色，其中 {color} 是基础色的名称。例如，.text-primary 类可以将文本颜色设置为 primary 基础色。

这是一段使用 primary 基础色的文本：  
<div class="text-primary">Hello, world!</div>

这是一段使用 primary 基础色的文本：

主题色

除了基础色外，Bootstrap 还提供了多种主题色，包括主色和辅助色。我们可以使用 .text-{theme} 类来设置文本颜色，其中 {theme} 可以是主题色的名称，例如 .text-danger 类可以将文本颜色设置为 danger 主题色。

这是一段使用 danger 主题色的文本：    
<div class="text-danger">Hello, world!</div>

这是一段使用 danger 主题色的文本：

混合颜色

此外，我们还可以将基础色和主题色混合使用，以达到更好的效果。例如，.text-primary .text-danger 类可以将文本颜色设置为 primary 基础色和 danger 主题色的混合颜色。

这是一段使用 primary 基础色和 danger 主题色混合的文本：     
<div class="text-primary text-danger">Hello, world!</div>

这是一段使用 primary 基础色和 danger 主题色混合的文本：

结语

以上就是 Bootstrap 文本颜色示例的介绍。通过使用这些类，我们可以轻松地设置文本颜色，让我们的网页更加美观。