如何使 class 覆盖元素 CSS 样式？

Question

下面分别是我的 CSS 和 HTML 代码。 我希望所有段落都是黑色字体，除了一组三个。 我知道我可以为这三个段落中的每一个段落赋予自己的 class 但如果有一种方法可以一次更改所有段落，我更愿意。 我认为将它们包装在一个 div 标签中并给该 div 标签“.special-paragraphs” class 会起作用，但它不起作用。 有什么办法可以做到这一点，还是我被迫单独编辑每个段落？

p { 
  color: black; 
}

.special-paragraphs {
  color: chartreuse;
  background-color: pink;
  font-family: Arial, Helvetica, sans-serif;
}

---

  <div class="special-paragraphs">
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. <br>
      Quo, quaerat repudiandae ad culpa minus repellat dolore, possimus <br>
      nemo qui sunt voluptas architecto iure accusantium nihil pariatur <br>
      dolores debitis error asperiores.</p>
    <p>Amet perspiciatis, cupiditate illo pariatur rem quasi ab <br>
      reprehenderit? Ex nisi consectetur possimus, corrupti voluptates <br>
      ullam, quod accusamus id iure quas consequuntur? Obcaecati aspernatur <br>
      minima, temporibus ea sed totam adipisci!</p>
    <p>Ipsa odit aut dicta perspiciatis vero commodi sequi reiciendis. <br>
      Eum fugit sapiente blanditiis non quisquam veniam harum iusto! Ex, <br>
      at. Laboriosam iusto provident consequuntur ab necessitatibus deserunt <br>
      ducimus, fugit fuga!</p>
  </div>

Answer 1

您可以使用...这不是更好，但可以

Answer 2

尝试添加：重要：

    .special-paragraphs {
      color: chartreuse !important;
      background-color: pink;
      font-family: Arial, Helvetica, sans-serif;
    }

Answer 3

您不需要为默认 P 元素指定样式。 因为它会覆盖所有的 P 元素。 所以你必须只为特殊段落添加样式。 它会起作用的。

.special-paragraphs
{
  color: chartreuse;
  background-color: pink;
  font-family: Arial, Helvetica, sans-serif;
}

<p>I am normal</p>
<div class="special-paragraphs">
<p>I am red</p>
<p>I am blue</p>
<p>I am green</p>
<div>