造型谷歌的新recaptcha复选框？

Question

我已经实现了Googles new recaptcha复选框，如下所示：

<div class="g-recaptcha" data-sitekey="MY_SITE_KEY"><div>

加载时，iframe内容如下所示：

<div class="rc-anchor rc-anchor-standard">
  ...
</div>

以下是为当前外观定义的样式：

.rc-anchor-standard {
  background: #f9f9f9;
  border: 1px solid #d3d3d3;
  color: #000;
}

我正试图实现这个目标：

我已将此添加到我的css文件中：

.rc-anchor-standard {
  background: #ffffff !important;
  border: 0px !important;
  color: #ffffff !important;
}

风格永远不会改变......有什么想法，为什么这不起作用？

谢谢， -Paul

Answer 1

这些样式位于来自其他域（google.com）的iframe内，因此无法根据同域策略更改这些样式...

您可以使用recaptcha（<div id="g-recaptcha" ...）

缩放div的内容

#g-recaptcha {
    transform: scale(1.42);
    transform-origin: 0 0 0;
}

Answer 2

首先，你忘记了分号';'在边界之后，

border: 0px !important

也许就是取消了白色文本和边框代码。我会解决这个问题，看看是否有任何变化。

========================================

如果这不是另一个错字，这可能就是原因：

你在这里调用了2个单独的div类，但是你把它们写成div中的div。

.rc-anchor .rc-anchor-standard {

用这个v替换^：

.rc-anchor, .rc-anchor-standard {