Bộ chọn con CSS được sử dụng để chọn tất cả các phần tử con với một phần tử mẹ cụ thể.
Cú pháp
Cú pháp cho bộ chọn con 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>
* {
padding: 5px;
}
article > div {
border: dashed midnightblue;
width: 45%;
}
div > p {
font-size: 20px;
font-style: italic;
box-shadow: inset 0 0 8px orange;
}
</style>
</head>
<body>
<h2>Examination Detail</h2>
<article>
<div>Exam Details</div>
<div><p>Exam begins at 11AM.</p></div>
<span><div> Do not bring cell phone.</div></span>
<div>
<div>Candidates should reach the center till 10:45.</div>
<br/>
The candidates need to be bring the Admit Card.
</div>
</article>
</body>
</html> Đầu ra
Điều này cho kết quả sau
Ví dụ
<!DOCTYPE html>
<html>
<head>
<style>
div {
margin: auto;
width: 200px;
padding: 30px;
background-color: moccasin;
}
div > div {
box-shadow: inset 0 0 8px mediumseagreen;
border-top-right-radius: 50%;
border-bottom-left-radius: 50%;
}
</style>
</head>
<body>
<div>
<div></div>
</div>
</body>
</html> Đầu ra
Điều này cho kết quả sau
