ReCAPTCHA v3 Google Badge 绘制在页面内容下方

Question

请访问此页面：

最好使用 iPhone6s 等小型手机。向下滚动到底部：

我知道如何识别某些控件并将其 Z 索引设置为 0，从而使徽章覆盖它们，但为所有内容添加此类设置将是一场噩梦。

相反，有没有办法做到相反呢？我可以获得此徽章以确保它绘制在页面内容的顶部吗？

如果您在 PC 上滚动到最底部，问题会更严重。将鼠标悬停在徽章上，它会显示在页脚区域下方。

我已经尝试过这个：

body:not(.page-id-833) .grecaptcha-badge {
  z-index: 99999;
  display: none;
}

没有喜悦。

Answer 1

因此，您将徽章设置为不显示。只需将其设置为在您希望其显示的页面上显示为块，使用 important 覆盖第一个样式。:)

.grecaptcha-badge {
   display:none;
}
.page-id-833 .grecaptcha-badge {
   z-index: 99999;
   display:block !important;
}

至于高z-index。这正是您提供的网站上有效的。如果您遇到问题并且它仅适用于您的某些页面。只需将 !important 添加到您的样式表中即可。