css - Pin It 按钮的位置问题

Question

我对 Pin It 按钮的位置有一些疑问。

我将这个 cose 添加到页面:

<script type="text/javascript" async defer  data-pin-color="red" data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>

喜欢 pinterest 在 official site 中说.

按钮在悬停时出现但位置不佳 - 距离顶部很远，如您在此屏幕截图中所见:

我没有找到任何方法通过 js 或 css 来改变这个位置。

我没有链接，因为它在我的本地机器上，但您可以通过网站和开发工具的屏幕截图看到它:

有人知道这个的解决方案吗？

Answer 1

您可以在 css 中用 !important 覆盖按钮的类或 ID。我们看不到 class 或 id 是什么，因为您没有与我们共享 HTML 代码。想象一下:

<div class="pinit"></div>

CSS:

.pinit {
     top : 0px !important;
}

编辑

使用伪类你可以:

 a[class$="pin_it_button_20"]{ top: 20px!important ;} 

表示classname以pin_it_button_20结尾的anchor

你也可以让它反转

a[class^="PIN"]{ top: 20px!important ;} 

表示类名以PIN开头的主播