JSFiddle - React, Tailwind, and code Playground

by seino

HTML

<p>ほげほげ</p>
<p>ほげほげ</p>
<div>
	<p>ほげほげ</p>
	<p>青色になる。詳細度が高いセレクタが適用される。</p>
</div>
<ins>
	<p>赤色になる</p>
</ins>
<ins>
	<p>ほげほげ</p>
	<p><em>これは赤色にならない</em>　この要素の最後がpではないからであり、「”要素中の最後”のE」と「要素中の”最後のE”」の勘違いに注意</p>
	<span>ふがふが</span>
</ins>
<p>ほげほげ</p>
<p>赤色になる。</p>

CSS

p:last-child {
	background-color: red;
}
 
/* DIV要素中の最初のp */
div > p:last-child {
	background-color: blue;
}