如果这是一个错误或我的理解很差,请澄清我.
我试图将第一个类型的选择器应用于一组div和p标签,并发现每个选择器的行为都不同.它只选择div标签的.form__group类而不是p标签
/* css */
.form__group:first-of-type {
background: red;
}
.form__group:first-of-type span {
font-weight: bold;
}Run Code Online (Sandbox Code Playgroud)
<!-- form__group class for p tag -->
<form class="form">
<p class="form__message">test</p>
<p class="form__group">
<span>The first paragraph.</span>
</p>
<p class="form__group">The second paragraph.</p>
</form>
<!-- form__group class for div tag -->
<form class="form">
<p class="form__message">test</p>
<div class="form__group">
<span>The fourth paragraph.</span>
</div>
<div class="form__group">The fifth paragraph.</div>
</form>Run Code Online (Sandbox Code Playgroud)