Bộ chọn :nth-last-child(n) trong CSS

1) Bộ chọn :nth-last-child(n) trong CSS

- Bộ chọn :nth-last-child(n) dùng để chọn những phần tử là phần tử con thứ n (từ dưới lên) của cha nó.

2) Cách sử dụng bộ chọn :nth-last-child(n) trong CSS

- Để sử dụng bộ chọn :nth-last-child(n), ta dùng cú pháp như sau:

:nth-last-child(n){
    các khai báo định dạng CSS
}

3) Một số ví dụ

Ví dụ:

- Chọn tất cả những phần tử là phần tử con thứ ba (từ dưới lên) của cha nó

:nth-last-child(3){
    border:1px solid black;
}

Xem ví dụ

Ví dụ:

- Chọn tất cả những phần tử <p> là phần tử con thứ ba (từ dưới lên) của cha nó

p:nth-last-child(3){
    border:1px solid black;
}

Xem ví dụ

Ví dụ:

- Chọn tất cả những phần tử nằm bên trong <div> và những phần tử đó phải là phần tử con thứ ba (từ dưới lên) của cha nó

div :nth-last-child(3){
    border:1px solid black;
}

Xem ví dụ

Ví dụ:

body :nth-last-child(odd){
    background-color:yellow;
    font-size:25px;
}
body :nth-last-child(even){
    background-color:crimson;
    font-size:25px;
}

Xem ví dụ

Ví dụ:

:nth-last-child(3n + 0){
    background-color:yellow;
}

Xem ví dụ