css選擇class中的第一個怎麼選？使用first-of-type？

Dom結構

<div id="test">
    <span class="hha">我是span</span>
    <h1 class="hha">我是h1</h1>
    <h1>我是h1</h1>
    <h1 class="hha">我是h1</h1>
    <h1 class="hha">我是h1</h1>
    <h1>我是h1</h1>
</div>

1.指定標籤

h1:first-of-type {
    color: red;
    // #test底下全部的h1找出來，其中第一個h1的字體顏色改成red；
}

2.指定class

.hha:first-of-type {
    color: blue;
    // 1.找到全部class爲hha的標籤，上面的Dom結構裏有<h1>、<span>;
    // 2.找到Dom結構全部h一、span（爲了方便理解記做list1，list2）；
    // 3.若是list一、list2中第一個標籤的class是hha，第一個class爲hha的字體改成blue;
}

觸類旁通，下面的代碼會把字體顏色改成orange？

.hha:last-of-type {
  color: orange;
}

以h1標籤爲例，因此第一步省略。
2.找到Dom結構裏面的全部的h1標籤（記做list3）

3.若是list3最後一個元素的class爲hha，把字體顏色改成orange