見出し1
後ろから5番目
後ろから4番目
後ろから3番目
見出し2
後ろから2番目
見出し3
後ろから1番目
ある要素内の、兄弟関係にある E要素の最後から数えて n番目の E要素に対してスタイルが適用されます。(他の種類の兄弟要素は数えません。) E:nth-child(n) と同様、n の部分には、an+b の形式や odd 、even も指定できます。
p:nth-last-of-type(2n) { background-color: pink; } p:nth-last-of-type(2n+1) { background-color: skyblue; }
<h3>見出し1</h3> <p>後ろから5番目</p> <p>後ろから4番目</p> <p>後ろから3番目</p> <h3>見出し2</h3> <p>後ろから2番目</p> <h3>見出し3</h3> <p>後ろから1番目</p>
後ろから5番目
後ろから4番目
後ろから3番目
後ろから2番目
後ろから1番目
※ E、n、a、b など斜体は仮の名前です。