Question

我在这里有一个网页：http://www.indiespil.dk/aitasi-under-construction-page/Aitasi/image/

我下载了一个HTML模板，我认为它正在使用Bootstrap。我不是程序员，所以这是我第一次使用HTML，CSS，Bootstrap和所有这些东西。

现在我的网页上的所有内容都完全没问题，除了一件事：第二部分中的文字颜色，其中显示＆＃34;竞争＆＃34;，＆＃34;游戏钱包＆＃34;，＆＃ 34;独立硬币＆＃34;和＆＃34;社区＆＃34;

这些字是黑色的，我需要它们是白色的。

该文本现在称为

，其颜色代码为＃000000，大小为18px。

我需要在网站上使用较低的h3，但我想制作一个与h3大小相同的自定义标题（例如h7），而不是白色。

我尝试制作一个h7，它实际上是白色和相同的大小，但是当我在我的索引文件中输入h7时，它没有像其余部分那样对齐。

如何正确对齐？

感谢。

Answer 1

您不需要创建H7标题元素，只需在更改颜色时将!important规则添加到css中的单独类中。

<强> HTML

<h3 class="whiteTextOverride"> example with white text override </h3> 
<h3> example with default colour </h3>

<强> CSS

.whiteTextOverride
{
 color: white !important;
}

这将覆盖bootstrap设置的颜色，并允许您仅为该标题中的文本选择特定颜色。

P.S。值得一提的是你不应该对css中的！important特性感到疯狂，因为如果你不小心它会影响其他类，所以最低限度使用它并查看this文章何时应该使用它。祝你好运！

实施例

h3
{
 color: red;   
}

.whiteTextOverride
{
 color: white !important;
}

.darkBackground
{
  background: #000000;
}

<div class="darkBackground">
  <h3 class="whiteTextOverride"> example with white text override </h3> 
  <h3> example with default colour </h3> 
</div>

Answer 2

从它的外观来看，我猜测h7标签没有对齐，因为h3元素前面是.service类。如果你想制作一个h7，你必须确保它在css中的h7标签之前有一个.service类。 h3标签设置如下：

.service h3{
    color: #000000;
    font-size: 18px;
    text-transform: uppercase;
}

你想做这样的事情：

.service h7{
    color: #FFFFFF;
    font-size: 18px;
    text-transform: uppercase;
}

希望有所帮助。

如何使用CSS文件更改引导程序中的H3颜色

2 个答案:

实施例