如何用外部 CSS 覆盖内联 CSS（特别是具有某些 class 的 div）？

Question

我正在尝试修复由一排社交媒体共享按钮引起的对齐问题，特别是 Google+ 按钮生成的代码。我没有设置此站点，我不确定该按钮是如何实现的，只知道它是 AddThis 插件或其他东西的一部分。

Google+ 按钮似乎会自动生成带有内联 CSS 样式的 div：

<div class="google_plusone_iframe_widget" style="width:90px;height:25px;">

我需要摆脱宽度和高度，但如何从外部覆盖它？我尝试了以下但没有用：

div.google_plusone_iframe_widget[style] {width:auto!important; height:auto!important;}

有谁知道我该怎么做？先感谢您！这是参考页面，我指的是左上角的社交媒体按钮：

Answer 1

尝试添加此代码 #leftNav .addthis_toolbox .google_plusone_iframe_widget {width:auto!important; height:auto!important;} 来实现。

Answer 2

您的 CSS 选择器应该是：

.google_plusone_iframe_widget {width:auto !important; height:auto !important;}

删除选择器中的 [style] 属性，就不需要指定 div 标签了。

Answer 3

可以试试这个吗#leftNav a.addthis_button_google_plusone .google_plusone_iframe_widget[style] {width:auto!important; height:auto!important;}

Answer 4

请试试这个

 #leftNav a.addthis_button_google_plusone.at300b .google_plusone_iframe_widget {
    width: auto !important;
    height: auto !important;
}

Answer 5

如果它在 iframe 中，我们无法为其应用任何样式或脚本。

How to override inline CSS (specifically a div with certain class) with external CSS?