Bộ chọn CSS : nth-last-of-type ()

Chỉ định màu nền cho mọi phần tử <p> là phần tử p thứ hai của phần tử cha của nó, tính từ phần tử con cuối cùng:

p:nth-last-of-type(2) {
background: red;
}

Thêm các ví dụ "Hãy tự mình thử" bên dưới.

Định nghĩa và Cách sử dụng

Bộ chọn khớp với mọi phần tử là phần tử con thứ n , của một kiểu cụ thể, của cha mẹ của nó, tính từ phần tử cuối cùng.:nth-last-of-type(n)

n có thể là một số, một từ khóa hoặc một công thức.

Mẹo: Nhìn vào bộ chọn : nth-last-child () để chọn phần tử là phần tử con thứ n , bất kể loại , cha của nó, tính từ phần tử cuối cùng.

Phiên bản:	CSS3

Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ bộ chọn.

Selector
:nth-last-of-type()	4.0	9.0	3.5	3.2	9.6

:nth-last-of-type(number) {
css declarations;
}

Lẻ và chẵn là những từ khóa có thể được sử dụng để so khớp các phần tử con có chỉ số là lẻ hoặc chẵn (chỉ số của phần tử con đầu tiên là 1).

Ở đây, chúng tôi chỉ định hai màu nền khác nhau cho các phần tử p chẵn và lẻ:

p:nth-last-of-type(odd) {
background: red;
}

p:nth-last-of-type(even) {
background: blue;
}

Sử dụng công thức ( an + b ). Mô tả: a đại diện cho kích thước chu kỳ, n là bộ đếm (bắt đầu từ 0) và b là giá trị bù.

Ở đây, chúng tôi chỉ định màu nền cho tất cả các phần tử p có chỉ số là bội số của 3:

p:nth-last-of-type(3n+0) {
background: red;
}