Định nghĩa và sử dụng
"tag01>tag02" chọn tất cả thành phần <tag02> có thành phần cha là <tag01>.
Cấu trúc
tag01>tag02 {
property : value;
}
Trong đó:
● tag01, tag02 là thành phần HTML/XHTML.
● property là những thuộc tính CSS.
● value là giá trị của các thuộc tính CSS.
Khi sử dụng cấu trúc trên trình duyệt sẽ chọn tất cả các tag02 có thành phần cha là tag01.
Ví dụ
HTML viết:
<html> <head> </head> <body> <div> <p>Đây là thành phần p nằm bên trong thành phần div</p> <p>Đây là thành phần p nằm bên trong thành phần div</p> </div> </body> </html>
Hiển thị trình duyệt khi chưa có CSS:
Đây là thành phần p nằm bên trong thành phần div
Đây là thành phần p nằm bên trong thành phần div
CSS viết:
div>p {
color: #ff0000;
}
Định kiểu cho tất cả tag <p> nằm bên trong tag <div>.
Hiển thị trình duyệt khi đã có CSS:
Đây là thành phần p nằm bên trong thành phần div
Đây là thành phần p nằm bên trong thành phần div
Trình duyệt hỗ trợ
"tag01>tag02" được hỗ trợ trong đa số các trình duyệt.
Ghi chú: Cần khai báo <!DOCTYPE> cho các trình duyệt IE8 trở xuống.