Question

我正在自定义引导程序模板。我想将文本修饰更改为普通大小写，而不是默认情况下模板随附的大写。

.masthead {
  padding-top: calc(6rem + 74px);
  padding-bottom: 6rem;
}

.masthead .masthead-heading {
  font-size: 2.75rem;
  line-height: 2.75rem;
}

.masthead .masthead-subheading {
  font-size: 1.25rem;
}

.masthead .masthead-avatar {
  width: 15rem;
}

@media (min-width: 992px) {
  .masthead {
    padding-top: calc(6rem + 104px);
    padding-bottom: 6rem;
  }
  .masthead .masthead-heading {
    font-size: 4rem;
    line-height: 3.5rem;
  }
  .masthead .masthead-subheading {
    font-size: 1.5rem;
  }
}

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<header class="masthead bg-primary text-white text-center">
  <div class="container d-flex align-items-center flex-column">

    <!-- Masthead Avatar Image -->
    <img class="masthead-avatar mb-5" src="img/avataaars.svg" alt="">

    <!-- Masthead Heading -->
    <h1 class="masthead-heading text-uppercase mb-0">Hi. I'm Anas Ansari</h1>

    <!-- Icon Divider -->
    <div class="divider-custom divider-light">
      <div class="divider-custom-line"></div>
      <div class="divider-custom-icon">
        <i class="fas fa-star"></i>
      </div>
      <div class="divider-custom-line"></div>
    </div>

    <!-- Masthead Subheading -->
    <p class="masthead-subheading font-weight-light mb-0">Graphic Artist - Web Designer - Illustrator</p>

  </div>
</header>

我尽一切努力覆盖默认规则，但没有任何效果。我尝试给出！important我试图给出id。我尝试增加特异性。但是没有什么能改变这个该死的工作。我为此浪费了2个不眠之夜。我可以通过删除text-uppercase类来实现。但是，可以在不删除text-uppercase类的情况下完成此操作吗？你能帮我吗？

如何使用我的自定义规则覆盖引导程序规则？

0 个答案: