Cách dụng CSS Selector
Trước khi tìm hiểu khái niệm CSS Selector là gì thì mình muốn nhắc lại kiến thức về HTML và CSS một chút. Như bạn đã biết các thẻ HTML thường sẽ có thẻ mở 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:
CSS Selector con cháuQuan hệ con cháu phù hợp với tất cả các 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 conQuan hệ con chọn tất cả các phần tử là các 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ử : CSS Selector anh chị em liền kề.Quan hệ anh chị em liền kề chọn tất cả các 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 Selectoranh chị emQuan hệ anh chị em là tất cả các 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ẻ miễn là
đứng sau :
Ngoài ra còn có các cách viết css selector khác bạn tham khảo bảng sau nhé:
Hi vọng bài viết này sẽ giúp các bạn hiểu rõ hơn về CSS Selector là gì? Nếu muốn mình chia sẻ thêm kiến thức gì hãy để lại bình luận bên dưới nhé. Cảm ơn bạn đã xem hết bài viết này. |