Css sẽ không ghi đè các giá trị kế thừa

Question

Tôi có Html chứa một cái gì đó như: (Nhiều div trong div A).

<div class="a"> 
    <div class="b"></div> 
</div> 

css của tôi trông như thế:

.a div { 
    border: solid; 
    border-width: thin; 
} 

.b { 
    border: none; 
    border-width: 0px; 
    border-collapse: collapse; 
} 

Đối với giá trị một số lý do của b sẽ không ghi đè lên một. Tuy nhiên, , nếu tôi chỉ viết chứ không phải là "a .div" tôi sẽ không nhận được hành vi mong đợi cho các div khác bên trong a.

Cách duy nhất tôi làm việc này là sử dụng "quan trọng!" (nghĩa là "border: none! important";) nhưng điều đó có vẻ kém thanh lịch hơn.

sẽ thích bất kỳ ý tưởng nào về những gì đang diễn ra ở đó ..

Ehud.

Answer 1

.a div có độ đặc hiệu cao hơn .b.
Nếu bạn muốn css cho .b để ghi đè lên .a, hãy cung cấp cho nó độ đặc hiệu cao hơn, ví dụ: .a div.b.

(Hoặc bạn có thể sử dụng !important, vâng, nhưng điều đó không được khuyến khích ở đây.)

Answer 2

Bộ chọn của bạn sai.

Thay vì

a. div { 

Viết

div.a { 

(chọn bất kỳ div với một lớp học của "a")

Thay vì

b { 

(mà sẽ thực sự cố gắng tạo kiểu cho tất cả b yếu tố)

Sử dụng

.b { 

(mà nói chọn bất cứ điều gì được xác định bởi các lớp của "b")

EDIT (để đáp ứng với phản ứng)

Để chọn tất cả các div nằm trong div với lớp "a", hãy sử dụng công cụ chọn sau: -

div.a div 

Answer 3

đặc điểm được tính bằng các trình biên dịch CSS, số điểm cao nhất trong tuyên bố được để thay đổi nội dung.

Điểm chung được tính bằng lệnh này:

inline id-element class-element no.-of-elements 
    $   $    $    $ 

($) -> 1 nếu loại tương ứng của đặc hiệu tồn tại trong mã
($) -> 0 nếu loại tương ứng của đặc doesn 't tồn tại trong mã

vì vậy, đây
cho .a div điểm sẽ là 0012
cho .b điểm sẽ là 0011
một rõ ràng đầu tiên thắng vì vậy nó được sửa đổi nội dung mặc dù .b cố gắng để ghi đè .a div

(OR)

bạn thể sử dụng !important trong việc kê khai để hoàn thiện mà khai