使用CSS覆盖通过JS添加的内联样式
使用CSS覆盖通过JS添加的内联样式
提问于 2012-07-01 19:39:11
一个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;
}还是一无所获。
回答 3
Stack Overflow用户
回答已采纳
发布于 2012-12-12 00:13:28
与其他答案相反，可以使用CSS覆盖内联样式：
http://css-tricks.com/override-inline-styles-with-css/
我猜测极长的选择器可能没有命中元素。
我在Janrain插件中遇到了类似的z-index问题，解决方法如下：
#janrainEngageEmbed > div[style] {
z-index: 0;
}在您的情况下，您可能需要：
z-index: 0 !important;Stack Overflow用户
发布于 2012-07-01 19:43:24
内联样式将胜过任何选择器。要么在javascript中自己重置样式，要么修补插件...老实说，这听起来并不是写得特别好。：)
Stack Overflow用户
发布于 2012-07-01 19:43:53
内联样式总是覆盖外部和内部css，再加上插件使用!important子句的事实(非常糟糕的做法！)，所有这些都使得只使用css来修复它是不可能的。我估计你将不得不使用一些自定义的js来覆盖插件设置。
也许最好的方法是检查您是否可以使用插件指定一个回调函数，并根据需要设置样式。这里的另一个答案建议编辑插件本身，如果你不打算更新它，这是很酷的-否则你最好让插件代码保持原样，只添加一些你自己的定制js
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/11281633
复制相关文章
相似问题
腾讯云开发者
