Bootstrap中可用的文本颜色类

Question

我正在开发一个注册页面,在导航栏上放置一些文本作为标题.我想给那些文本不同的颜色.为此我正在使用一个单独的CSS文件,但我想使用bootstrap的CSS文件来完成此操作.

任何人都可以在bootstrap中列出可用的颜色类吗？

Answer 1

该引导3文档辅助类下的列表如下: Muted,Primary,Success,Info,Warning,Danger.

该引导4文档水电费清单本- >颜色,并有更多的选择: primary,secondary,success,danger,warning,info,light,dark,muted,white.

要访问它们,可以使用 class text-[class-name]

所以,如果我想要蓝色文本,例如我会做这样的事情:

<p class="text-primary">This text is the blue primary color.</p>

这不是一个大量的选择,但它是一些.

Answer 2

导航栏上的文本通常使用bootstrap.css文件中的以下两个css类之一进行着色.

首先,如果使用默认导航栏(灰色导航栏),.navbar-default将使用该类,并将文本着色为深灰色.

.navbar-default .navbar-text {
  color: #777;
}

另一种情况是使用反向导航栏(黑色),文本颜色为灰色60.

.navbar-inverse .navbar-text {
  color: #999;
}

因此,您可以根据需要更改其颜色.但是,我建议您使用单独的css文件来更改它.

注意:您还可以使用本节中提供的自定义程序.Twitter BootstrapNavbar

Answer 3

您可以使用文本类：

.text-primary
.text-secondary
.text-success
.text-danger
.text-warning
.text-info
.text-light
.text-dark
.text-muted
.text-white

在需要的任何标记中使用文本类。

<p class="text-primary">.text-primary</p>
<p class="text-secondary">.text-secondary</p>
<p class="text-success">.text-success</p>
<p class="text-danger">.text-danger</p>
<p class="text-warning">.text-warning</p>
<p class="text-info">.text-info</p>
<p class="text-light bg-dark">.text-light</p>
<p class="text-dark">.text-dark</p>
<p class="text-muted">.text-muted</p>
<p class="text-white bg-dark">.text-white</p>

您可以根据需要添加自己的类或修改以上类。