CSS ghi đè nhiều lớp tài sản

Question

Nếu tôi có một lớp phong cách định nghĩa như vậy:

.myclass{ 
    //bunch of other stuff 
    float:left; 
} 

và tôi xác định một lớp như thế này:

.myclass-right{ 
    float:right; 
} 

và tôi xác định một div theo cách này:

<div class="myclass myclass-right"></div> 

Div đó có kế thừa mọi thứ từ lớp của tôi không, nhưng ghi đè thuộc tính float để nổi: phải không? Đó là những gì tôi mong đợi sẽ xảy ra. Cũng loại muốn biết nếu có bất kỳ tác động qua trình duyệt (trình duyệt tốt so với IE 7 hoặc cao hơn, f *** IE6).

Answer 1

Chừng nào các selectors có độ đặc hiệu tương tự (trong trường hợp này họ làm) và .myclass-right phong cách khối là được xác định sau .myclass, vâng.

Chỉnh sửa để mở rộng: thứ tự các lớp xuất hiện trong phần tử html không có hiệu lực, điều duy nhất quan trọng là độ đặc hiệu của bộ chọn và thứ tự mà bộ chọn xuất hiện trong biểu định kiểu.

Answer 2

Sử dụng !important là một cách để thực hiện.

.myclass-right{ 
    float:right !important; 
} 

Bên cạnh đó nếu bạn là cụ thể hơn với selector của bạn nó nên ghi đè cũng

div.myclass-right{ 
    float:right; 
} 

Answer 3

Miễn là myclass-right được khai báo sau lớp khác của bạn trong tệp css, nó sẽ hoạt động.

Answer 4

Chỉ muốn ném ra một lựa chọn khác ngoài việc quan trọng cũng như trật tự định nghĩa kiểu: bạn có thể chuỗi hai cùng nhau cũng như:

.myclass.myclass-right{float:right;} 
.myclass{float:left;} 

Answer 5

Trong trường hợp các thuộc tính CSS xung đột, thẻ CSS mà đến sau thiết bị còn lại trong biểu định kiểu sẽ được ưu tiên.

Nói cách khác - nếu bạn muốn một số lớp ghi đè lên những người khác - chỉ cần đặt nó vào cuối tệp css của bạn.