Question

在此代码中：

...
<div class="job-overview no-company-desc">
  <h2 class="job-overview-title">Overview</h2>
    <p>Jamit&#8217;s client is looking for a Senior Software Engineer constantly iterating and pushing releases into production.</p>
<p><strong>Qualifications:</strong></p>
<ul>
<li>Experience leading a team of developers by example – following excellent coding habits and best practices</li>
<li>Experience in an Agile software development environment in a web context</li>
<li>A thorough understanding of how business needs drive product features</li>
<li>Demonstrated expertise with the entire software development life cycle</li>
</ul>
            </div>

包含各种css样式表，我尝试通过将我的css代码放在标题的最后来覆盖它们，即

<style type="text/css">
  p { color: blue; }
  li { color: blue; }
</style>

这使得LI项列表为蓝色，但不是P内容。关于使P内容的任何建议都是蓝色的吗？

Answer 1

在目前的情况下，它很好 - 必须有一些更具特异性的CSS。要么删除，要么更具体。 !imporant 将解决此问题，但我不建议使用它。 Reason here.

如果您无法删除原始样式，请尝试覆盖它..

div.job-overview.no-company-desc p {
    color: blue;
}

或者，更具体地说，您可以使用:(假设p跟随h2。）

div.job-overview.no-company-desc h2 + p {
    color: blue;
}

如果特异性不是答案，那么解决方案就是CSS应用的顺序。除此之外，如果你试图覆盖内联样式 - 你不能，除非你使用!important。

为什么我可以覆盖`li`上的字体颜色而不是'P`标签的内容？

1 个答案: