áp dụng kiểu css cho một lớp lồng trong div

Question

Tôi không biết chính xác cách áp dụng css cho phần tử lồng nhau. Đây là mã ví dụ của tôi, nhưng tôi đang tìm hướng dẫn giải thích tất cả các quy tắc.

<div id="content"> 
    <div id="main_text"> 
     <h2 class="title"></h2> 
    </div> 
</div> 

Làm thế nào tôi có thể áp dụng css để chỉ lớp title lồng vào bên trong đó đặc biệt div?

Answer 1

bạn sử dụng

#main_text .title 
{ 
    /*attributes*/ 
} 

nếu bạn chỉ cần đặt một không gian giữa các selectors, phong cách sẽ áp dụng cho tất cả trẻ em (và trẻ em trẻ em) của người đầu tiên. Vì vậy, trong trường hợp này, bất kỳ phần tử con nào của #main_text có tên lớp là .title. Nếu bạn sử dụng > thay vì một không gian, nó sẽ chỉ chọn những con trực tiếp của nguyên tố này, và không phải trẻ em của trẻ em, ví dụ:

#main_text>.title 
{ 
    /*attributes*/ 
} 

hoặc sẽ làm việc trong trường hợp này, nhưng người đầu tiên thường được sử dụng hơn.