CSS Selector for first nested element with class

Question

Trying to select the first instance of an element of class 'vidplayicon' in each 'imgClass' div.

here is my HTML

<div class="imgClass">
  <div>
    <p>test</p>
  </div>
  <div>
    <p class="vidplayicon">test</p> <!-- this should be selected-->
  </div>
  <div>
    <p class="vidplayicon">test</p>
  </div>
</div>
...
<div class="imgClass">
  <div>
    <p class="vidplayicon">test</p> <!-- this should be selected-->
  </div>
  <div>
    <p class="vidplayicon">test</p>
  </div>
  <div>
    <p class="vidplayicon">test</p>
  </div>
</div>

and this is my CSS

.imgClass  div .vidplayicon:first-of-type{
    color:red;
}

but it's not working can I have some suggestions?

Answer 1

它首先用于标记名称，而不是类。

查看this thread.