覆盖 iframe 中的硬编码元素样式

Question

我无法访问此表单的 html，所有主题化都必须通过加载到显示表单的 iframe 中的 css 来完成。是的，这段代码很烦人，也是不好的做法，但它就是这样。

<input 
    class="give-input required" 
    type="text" 
    name="give_first" 
    autocomplete="given-name" 
    placeholder="First Name" 
    id="give-first" 
    value="" 
    required="" 
    aria-required="true" 
    style="padding-left: 33px!important;" tabindex="1">

以下版本（以#give-first 开头并添加了更高的特异性）不起作用

#give-first-name-wrap input#give-first.give-input.required[style] 
{ 
    padding-left:0; 
}

我没有将 jQuery 加载到 iframe 中的钩子，非常烦人！

感谢所有建议。

Answer 1

style 属性比任何选择器都具有更高的特异性。

只有当它们不是 !important 并且您使用 !important 规则时，它们才能被覆盖。

在这种情况下，规则是 !important，因此您不能覆盖它。

---

你可以用 JS 替换它。你don't need jQuery。