Bộ chọn hậu duệ và lớp trong CSS
Giả sử chúng ta có đoạn mã sau:
<div class="block">
<h2>Tiêu đề</h2>
<p>
văn bản
</p>
</div>
<div class="block">
<h2>Tiêu đề</h2>
<p>
văn bản
</p>
</div>
Hãy chọn tất cả các tiêu đề h2 và
đoạn văn nằm bên trong phần tử có lớp
block, và tô màu chúng thành các màu khác nhau.
Hãy sử dụng bộ chọn hậu duệ (là dấu cách
giữa các bộ chọn):
.block h2 {
color: red;
}
.block p {
color: green;
}
Cho đoạn mã sau:
<p class="eee">
văn bản <i>in nghiêng</i>
</p>
<p class="eee">
văn bản <i>in nghiêng</i>
</p>
<div class="eee">
văn bản <i>in nghiêng</i>
</div>
<div class="eee">
văn bản <i>in nghiêng</i>
</div>
Hãy tô màu đỏ tất cả các thẻ i,
nằm trong các phần tử có lớp eee.