2

我一直在考虑在网站上实施 Apple Pay,目前正在调查 Apple 为 Apple Pay 按钮规定的各种 UI 品牌指南,并且一直在关注Apple 网站上的开发者示例。

Safari 浏览器中嵌入了很多样式很有用,但我很难了解如何更改按钮中文本和 Apple 徽标的大小。我目前正在设置以下CSS:

.apple-pay-button {
    display: inline-block;
    -webkit-appearance: -apple-pay-button;
    -apple-pay-button-type: donate;
    -apple-pay-button-style: white-outline;
    background-image: -webkit-named-image(apple-pay-logo-white);
    height: 177px;
    width: 100%;
    border-radius: 5px;
    padding: 0;
    background-color: white;
}

苹果标志和文字很大。设置 font-size 没有任何效果,所以不能那样。唯一似乎与按钮中的字体和徽标大小有关的是通过调整高度,我需要高度为 177px 以匹配其他按钮。

还有一个相关的问题是徽标和文本实际上是如何呈现的?Safari 开发工具显示一个空的 div。那里没有伪元素,而且它似乎不是来自影子 DOM。我假设徽标是 SVG,因为它似乎可以很好地缩放,但我在开发工具中看不到它。确切地知道 Apple 标志和文字的来源会很方便。

谢谢

4

0 回答 0