CSS Selector là gì? Những cách viết CSS có thể bạn chưa biết.

 ngoại trừ các thẻ không có thẻ đóng như ,   bên trong thẻ đó có thể có nhiều thẻ khác nữa. Vậy ta sẽ gọi thẻ tag đó là thẻ cha và các thẻ nằm bên trong nó là thẻ con.Khi bắt tay vào học Frontend thì những bạn phải nắm rõ những khái niệm về css trong đó có khái niệm CSS Selector mà bạn cần phải học thuộc lòng. CSS Selector là một bộ chọn để style cho website. Hiểu đơn thuần CSS Selector là được cho phép bạn nhắm tới những thành phần HTML để vận dụng những thuộc tính CSS cho chúng .

CSS Selector có thể chứa nhiều selector đơn giản. Giữa các selector đơn giản, chúng ta có thể bao gồm một selector kết hợp.

Có bốn bộ phối hợp khác nhau trong CSS :

• Bộ chọn con cháu (cách nhau bởi khoảng trắng)
• Bộ chọn con (>)
• Bộ chọn anh chị em liền kề (+)
• Bộ chọn anh chị em chung (~)

CSS Selector “con cháu”

Quan hệ con cháu tương thích với toàn bộ những selector là con của một selectorđược chỉ định .

Ví dụ sau chọn tất cả các thẻ

bên trong các thẻ

div p {
    background-color: yellow;
}

CSS Selector cha con

Quan hệ con chọn toàn bộ những thành phần là những selector con ngay lập tức của một selector được chỉ định .

Ví dụ sau chọn tất cả các thẻ

là các phần tử con ruột của phần tử

div > p {
    background-color: yellow;
}

CSS Selector anh chị em liền kề.

Quan hệ anh chị em liền kề chọn tổng thể những selector đứng gần nhất với một selector được chỉ định .

Ví dụ sau chọn tất cả các thẻ

được đặt ngay sau các thẻ

div + p {
    background-color: yellow;
}

CSS Selector anh chị em

Quan hệ anh chị em là tổng thể những selector được chọn đứng sau và phải đứng cùng cấp với selector được chỉ định .

Ví dụ sau đây chọn tất cả các thẻ

là anh em ruột của thẻ