CSS :last-child Selector

CSS свойство :last-child позволяет выбирать последний элемент внутри своего родителя. То есть если у нас есть несколько элементов, расположенных внутри родительского элемента и мы хотим изменить стиль именно для последнего из них, мы можем использовать значение last-child.

Пример использования CSS свойства :last-child:

HTML:

    
Первый элемент
    
Второй элемент
    
Третий элемент
    
Последний элемент

CSS:

.parent p:last-child {
    color: red;
    font-size: 32px;
}

В данном примере мы выбираем последний элемент внутри родительского элемента с классом "parent" и применяем стили к нему. В данном случае мы изменяем цвет текста на красный и увеличиваем размер шрифта до 32 пикселей.

Также можно использовать CSS свойство :last-of-type, которое выбирает последний элемент того же типа, что и указанный в селекторе.

Пример использования CSS свойства :last-of-type:

HTML:

    
Первый элемент
    
Заголовок
    
Второй элемент
    
Третий элемент
    
Подзаголовок

CSS:

.parent p:last-of-type {
    color: red;
    font-size: 24px;
}

В данном примере мы выбираем последний элемент типа "p" внутри родительского элемента с классом "parent" и применяем стили к нему. В данном случае мы изменяем цвет текста на красный и увеличиваем размер шрифта до 24 пикселей.

Также можно использовать CSS свойство :nth-last-child(), которое позволяет выбрать элемент, расположенный на определенной позиции от конца списка дочерних элементов родительского элемента.

Пример использования CSS свойства :nth-last-child():

HTML:

    
Первый элемент
    
Второй элемент
    
Третий элемент
    
Четвертый элемент
    
Пятый элемент

CSS:

.parent p:nth-last-child(2) {
    color: red;
    font-size: 18px;
}

В данном примере мы выбираем элемент на позиции предпоследнего (второго с конца) внутри родительского элемента с классом "parent" и применяем стили к нему. В данном случае мы изменяем цвет текста на красный и уменьшаем размер шрифта до 18 пикселей.

Таким образом, CSS свойство :last-child позволяет выбирать последний элемент внутри родительского элемента и применять к нему стили, если это необходимо.