Question

这是我的 HTML 代码：

    <div class="feature-box col-lg-4">
    <i class="fas fa-bullseye fa-4x icon"></i>
    <h3 class="feature">Elite Designs</h3>
    <p style="color:#2F4F4F" class="points">We have all your favourite designs, the ones you can't ignore.</p>
  </div>

这是 CSS：

#title .points p{
  color:#2F4F4F;
}

我也应用了这个，但没有任何效果：

.points{
   color:#2F4F4F;
 }

Answer 1

您可以尝试将 !important 添加到颜色属性

像这样：

.points{
   color:#2F4F4F !important;
 }

这里也不需要 style="color:#2F4F4F"

Answer 2

我试过时效果很好。不过，您可以尝试使用 inspect elements 来检查发生了什么。

 <div class="feature-box col-lg-4">
    <i class="fas fa-bullseye fa-4x icon"></i>
    <h3 class="feature">Elite Designs</h3>
    <p style="color:#2F4F4F" class="points">We have all your favourite designs, the ones you can't ignore.</p>
  </div>

在这里，您使用了内联 CSS，它实际上可以覆盖您可能应用的任何其他样式。它应该可以正常工作。

尽管您可以在内部/外部 CSS 中尝试以下操作：

 .points{
   color:#2F4F4F !important;
 }

使用 !important 将覆盖与元素关联的任何其他样式。如果这不起作用，请尝试清除浏览器缓存，或使用其他浏览器查看输出。

Answer 3

p.points{
  color:#2F4F4F !important;
}

在您的代码中使用 !important，因为您使用了内联 CSS。 !important 将有助于覆盖您的内联 CSS。

Answer 4

Use this for inline styling

     <div class="feature-box col-lg-4">
        <i class="fas fa-bullseye fa-4x icon"></i>
        <h3 class="feature">Elite Designs</h3>
        <p style="color:#2F4F4F !important;" class="points">We have all your favourite designs, the ones you can't ignore.</p>
      </div>

或使用下面的外部样式

p.points{
  color:#2F4F4F !important;
}

or

.points{
  color:#2F4F4F !important;
}

CSS 中的 '!important' 规则用于增加属性/值的重要性

字体颜色不会改变

4 个答案: