Question

我使用AfterShip按钮，我想更改默认的css，服务给我一个iframe，我可以更改这些css设置吗？

在这里您可以看到按钮
的默认视图 https://www.aftership.com/features/track-button

有什么想法吗？

Answer 1

您无法操纵iframe。如果我在你的位置并且改变按钮样式是必须的，我会“欺骗”我的方式到你想要的样式在iframe按钮上面的html框（隐藏它）。然后，您可以将pointer-events:none添加到元素中，以便下面的iframe按钮可以点击。

这里有一个iframe示例：

#as-container-150399376720884 {
  position:relative;
}
.myButton {
  height:48px;
  width:126px;
  background-color:red;
  color:#fff;
  text-align:center;
  line-height:48px;
  pointer-events:none;
  position:absolute;
  left: 375px;
  top: 0px;  
}

<div id="as-container-150399376720884" style="width: 100%; height: 64px;">
  <iframe id="as-150399376720884" frameborder="0" scrolling="no" src="https://button.aftership.com/button_widget.html?&amp;size=large&amp;id=150399376720884&amp;slug=&amp;width=500px&amp;hide_tracking_number=false&amp;tracking_number=&amp;responsive=true&amp;origin=https%3A%2F%2Fwww.aftership.com%2Ffeatures%2Ftrack-button&amp;domain=track.aftership.com"
  style="width: 100%; overflow: hidden; border: 0px; max-width: 500px; height: 64px;"></iframe>
  <div class="myButton">MY button</div>
</div>

如何更改AfterShip按钮的CSS？

1 个答案: