html - 如何获得:not selector to work when the element is buried inside of another element

Question

这是我要操作的 html 代码。我需要突出显示 Chaz 的第三个引用 block 。我不应该使用 ID 或类来执行此操作。

<aside id="left">
         <h2>What they're saying about us</h2>
         <blockquote title="testimonials">
           <p>&quot;CSS coding is endlessly fun. I have such a great time doing it.&quot;</p>
           <cite>DGMD student</cite>
         </blockquote>
         <blockquote>
           <p>&quot;I will be so glad when this assignment is over. &quot;</p>
           <cite>Another student</cite>
         </blockquote>
         <blockquote>
           <p>&quot;Do you really need so many classes and IDs after learning these cool selectors?&quot;</p>
           <cite>Chaz</cite>
        </blockquote>
  </aside>

这是我为此创建的 css 代码，但我应该使用 :not 选择器来解决这个问题，每次我尝试使用它时都没有任何变化。

blockquote:last-of-type cite {
    background-color: purple;
    font-style: normal;
    color: white;
}

Answer 1

这个问题似乎建议您对所有 blockquote 元素应用突出显示，然后使用 CSS :not() 选择器来，呃，不选择最后一个元素当过度造型前两个时。使困惑？例如……

aside blockquote {
   background-color: pink;
}
aside blockquote:not(:last-of-type) {
    background-color: white; /* or page background-color */
}

希望对您有所帮助:)

See MDN > CSS3 > :not()