Định nghĩa và sử dụng “:empty” chọn thành phần rỗng, không chứa text hay thành phần khác. Cấu trúc :empty { property: value; } Ví dụ Html viết: <html> <head></head> <body> <p></p> <p>Thành phần p có chứa text</p> <div>Thành phần div</div> </body> </html> Hiển thị trình duyệt khi chưa có CSS:   Thành phần p […]

Định nghĩa và sử dụng “:root” chọn thành phần gốc của văn bản. Trong văn bản HTML thành phần gốc luôn luôn là html Cấu trúc :root { property: value; } Ví dụ Html viết: <html> <head></head> <body> <p>Thành phần p</p> <div>Thành phần div</div> </body> </html> Hiển thị trình duyệt khi chưa có CSS: Thành […]

Định nghĩa và sử dụng “:last-child” chọn thành phần cuối cùng của thành phần cha. Chỉ chọn thành phần có thành phần cha, những thành phần độc lập sẽ không được chọn. Cấu trúc :last-child { property: value; } Ví dụ Html viết: <html> <head></head> <body> <p>Thành phần độc lập thứ nhất</p> <p>Thành phần độc […]

Định nghĩa và sử dụng “:nth-last-of-type(n)” chọn thành phần thứ “n” trong thành phần cha, gốc tính được tính từ thành phần cuối cùng trở lại. Thứ tự “n” được tính cho tất cả các thành phần cùng cấp. Giá trị “n” có thể là số, keyword hay công thức. Cấu trúc :nth-last-of-type(n) { property: […]

Định nghĩa và sử dụng “:nth-of-type(n)” chọn thành phần thứ “n”, gốc tính được tính từ thành phần đầu tiên trở đi. Thứ tự “n” được tính cho tất cả các thành phần cùng cấp. Giá trị “n” có thể là số, keyword hay công thức. Cấu trúc :nth-of-type(n) { property: value; } Ví dụ […]

Định nghĩa và sử dụng “:nth-last-child(n)” chọn thành phần thứ “n” trong thành phần cha, gốc tính được tính từ thành phần cuối cùng trở lại. Thứ tự “n” được tính cho tất cả các thành phần cùng cấp. Chỉ chọn thành phần có thành phần cha, những thành phần độc lập sẽ không được […]

Định nghĩa và sử dụng “:nth-child(n)” chọn thành phần thứ “n” trong thành phần cha, gốc tính được tính từ thành phần đầu tiên trở đi. Thứ tự “n” được tính cho tất cả các thành phần cùng cấp. Chỉ chọn thành phần có thành phần cha, những thành phần độc lập sẽ không được […]

Định nghĩa và sử dụng “:only-child” Chọn thành phần con trong các thành phần cha, khi thành phần cha có mỗi thành phần con là chính nó, không được chứa thành phần con khác. Chỉ chọn thành phần có thành phần cha, những thành phần độc lập sẽ không được chọn. Thành phần con duy […]

Định nghĩa và sử dụng “:only-of-type” chọn thành phần con trong các thành phần cha, khi thành phần cha có một thành phần con là chính nó. Trong thành phần cha có thể chứa nhiều thành phần con, tuy nhiên thành phần con được chọn phải là duy nhất, không được có từ 2 trở […]

Định nghĩa và sử dụng “:last-of-type” chọn thành phần con cuối cùng hoặc duy nhất trong các thành phần cha. Cấu trúc :last-of-type { property: value; } Ví dụ Html viết: <html> <head></head> <body> <p>p tự do đầu tiên</p> <div> <ul> <li> <p>p duy nhất của li</p> </li> <li> <p>p duy nhất của li</p> </li> […]

Định nghĩa và sử dụng “:first-of-type” chọn thành phần con đầu tiên hoặc duy nhất trong các thành phần cha. Cấu trúc :first-of-type { property: value; } Ví dụ Html viết: <html> <head></head> <body> <p>p tự do đầu tiên</p> <div> <ul> <li> <p>p duy nhất của li</p> </li> <li> <p>p duy nhất của li</p> </li> […]

Định nghĩa và sử dụng “[attribute*=value]” Chọn tất cả thành phần với thuộc tính có giá trị đặc biệt bằng “value”. Giá trị đặc biệt bằng “value” có thể là: value abcvalue abc-value abc_value abc-value-def abc_value_def value-abc value_abc valueabc value-abc value_abc Ghi chú: Màu xanh là màu được chọn. Cấu trúc [attribute*=value] { property: value; } […]