8

一个 js 插件正在添加一个让我有些头疼的样式:

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

所以我试过这个:

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;
}

仍然没有。

4

3 回答 3

11

与其他答案相反,可以使用 CSS 覆盖内联样式:

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

我猜想极长的选择器可能没有击中元素。

我在 Janrain 插件中遇到了类似的 z-index 问题,已通过以下方式解决:

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

在您的情况下,您可能需要:

    z-index: 0 !important;
于 2012-12-11T16:13:27.770 回答
4

内联样式将胜过任何选择器。要么自己在 javascript 中重置样式,要么修补插件......老实说,无论如何,这听起来并不像写得特别好。:)

于 2012-07-01T11:43:24.167 回答
3

内联样式总是覆盖外部和内部 css,加上插件使用子句的事实!important(非常糟糕的做法!),所有这些都使得仅使用 css 修复它是不可能的。我认为您将不得不使用一些自定义 js 来覆盖插件设置。

也许最好的方法是检查您是否可以使用插件指定回调函数并根据需要设置样式。此处的另一个答案建议编辑插件本身,如果您不打算更新它,那很酷 - 否则您最好保留插件代码,只需添加一些您自己的定制 js

于 2012-07-01T11:43:52.810 回答