如何更改 Google Plus Pages Badge 的 CSS 样式？答案

【问题标题】：How to change css styles of Google Plus Pages Badge?如何更改 Google Plus Pages Badge 的 CSS 样式？
【发布时间】：2011-11-19 19:22:00
【问题描述】：

我在https://developers.google.com/+/plugins/badge/config上配置标准徽章

为它 Google+ 渲染 iframe 内容。如何在 iframe 中更改类样式？

【问题讨论】：

标签： google-plus google-plus-one badge

【解决方案1】：

目前似乎没有办法做到这一点。我尝试编辑 CSS 以摆脱烦人的边框和白色背景：

.yeb { 
    background-color: none !important;
    border: 0px solid gainsboro !important;
}

但由于 CSS 位于 Google 服务器中，因此您无法覆盖 iFrame。它是 Google 论坛中的当前feature request。

【讨论】：

【解决方案2】：

你可以做一个小技巧：

iframe 的 HTML：

<div id="social_gplus_circle">
<div id="social_gplus_circle_inner"><g:plus href="https://plus.google.com/105379671042990608528" size="smallbadge"></g:plus></div>
</div>

诀窍的 CSS：

#social_gplus_circle{overflow: hidden;width: 105px;height: 45px;padding-top: 7px;}
#social_gplus_circle_inner{overflow: hidden;position: relative;top: -20px;left: -130px;height: 50px;width: 276px;}
iframe{display: block!important;}

这不是我自己做的，我是从谷歌论坛得到的。

【讨论】：

【解决方案3】：

您无法更改它，因为 google plus 代码不在您的服务器上。如果您的页面和 iframe 代码在同一台服务器上，您只能修改 iframe CSS 。

【讨论】：

然而，谷歌似乎不仅使用了 iframe 的东西，而且还使用了 javascript append，目前我有一个问题，因为我已经为表格预定义了 css，而且 google+ 按钮也使用了它，所以它是一个有点乱，“泡泡”的一部分已经破灭了。
我知道。我询问更改 css 样式的替代方法。 Facebook 喜欢框有它。
是的 - 由于跨站点策略，您无能为力。直到谷歌提供了一种改变它的方法。您始终可以为 iframe 添加边框，或重新调整 iframe 的大小 - 但不能修改 iframe 内的内容。