Псевдоклас :last-of-type
Оновлено: 11.01.2023
Псевдоклас :last-of-type
Псевдоклас :last-of-type задає стиль останнього елемента певного типу в групі братніх елементів (що мають один батьківський елемент).
Як приклад розглянемо такий код HTML:
<article>
<p>Автор: Гордон Фрімен, канд. фіз.-мат. наук</p>
<p>Зміст статті</p>
</article>
Псевдоклас :last-of-type без зазначення селектора вибере останні елементи кожного типу (<h1>, <p>, <address>, <time>) і встановить для них червоний колір тексту.
article :last-of-type { color: red; }
Під час додавання селектора до :last-of-type спершу обираються зазначені елементи, потім із них береться останній елемент. Наявність інших елементів (<h1> і <address>) та їхній порядок не враховуються.
article p:last-of-type { color: red; }
Тут буде обрано останній абзац всередині <article> і виділено червоним кольором.
Синтаксис
Селектор:last-of-type { ... }