Override Styles Inline thêm vào thông qua JS với CSS

Question

Một js plugin được thêm một phong cách đó là đem lại cho tôi một số nhức đầu:

element.style { 
    z-index: 100 !important; 
} 

Vì vậy, tôi đã cố gắng này:

html body div#shell div#shellContent div#bottomPart div#rightCol div.containerBox  
div#embedContainer div#janrainEngageEmbed div.janrainContent div#janrainView 
div.janrainHeader[style] { 
    z-index: 1 !important; 
} 

và vẫn không có gì.

Answer 1

Trái với những câu trả lời khác, nó có thể ghi đè lên phong cách nội tuyến với CSS:

http://css-tricks.com/override-inline-styles-with-css/

tôi đoán rằng bộ chọn cực kỳ dài có thể không được đánh nguyên tố này.

Tôi đã có một vấn đề z-index tương tự với các plugin Janrain đã được giải quyết bằng cách này:

#janrainEngageEmbed > div[style] { 
    z-index: 0; 
} 

Trong trường hợp của bạn, có thể bạn cần:

z-index: 0 !important; 

Answer 2

Kiểu nội tuyến sẽ vượt trội hơn bất kỳ bộ chọn nào. Hoặc là thiết lập lại phong cách cho mình trong javascript hoặc vá các plugin ... nó không âm thanh như một đặc biệt tốt bằng văn bản anyway, phải trung thực. :)

Answer 3

kiểu nội tuyến luôn ghi đè lên css bên ngoài và bên trong, cộng với thực tế là plugin đang sử dụng mệnh đề !important (thực hành rất xấu!), Tất cả cùng nhau làm cho nó không thể sửa nó chỉ bằng css. Tôi nghĩ bạn sẽ phải sử dụng một số js tùy chỉnh để ghi đè lên các cài đặt plugin.

có lẽ cách tốt nhất là kiểm tra xem bạn có thể chỉ định chức năng gọi lại với plugin và đặt kiểu theo ý muốn hay không. một câu trả lời khác ở đây được đề xuất để chỉnh sửa plugin, điều đó thật tuyệt nếu bạn không có kế hoạch cập nhật - nếu không, bạn nên bỏ qua mã plugin và chỉ cần thêm một số jesp riêng biệt của riêng bạn