Bộ chọn phần tử CSS được sử dụng để chọn phần tử con của phần tử đầu tiên có tên phần tử khớp với bộ chọn thứ hai.
Cú pháp
Cú pháp cho bộ chọn hậu duệ CSS như sau -
element element {
/*declarations*/
} Ví dụ
Các ví dụ sau minh họa bộ chọn hậu duệ CSS -
<!DOCTYPE html>
<html>
<head>
<style>
div {
float: right;
margin: 25px;
padding: 5px;
width: 80px;
height: 80px;
border: solid aqua;
}
div div {
border-color: blue;
border-radius: 50%;
}
div div div {
border-color: orange;
border-radius: unset;
}
</style>
</head>
<body>
<div>
<div>
<div>
</div>
</div>
</div>
</body>
</html> Đầu ra
Điều này cho kết quả sau -
Ví dụ
<!DOCTYPE html>
<html>
<head>
<style>
li li {
background-color: lightsteelblue;
}
</style>
</head>
<body>
<ol>
<li></li>
<ul>
<li>
<ul>
<li></li>
</ul>
</li>
</ul>
<li></li>
</ol>
</body>
</html> Đầu ra
Điều này cho kết quả sau -
