Question

我创建了一个带有文本范围的按钮，我添加了背景图像到span。在Ios设备中，当我点击按钮时，背景图像消失。

.button {
    width: 210px;
    height: 34px;
    border-radius: 20px;
    background-color: #B5D676;
    border: 1px solid #587F54;
    color: #325c46;
    outline: none;
    cursor: pointer;
}

.button span {
    font-size: 1em;
    font-family: ptsans-bold, sans-serif;
    padding-left: 40px;
    display: inline-block;
    height: 25px;
    background-position: left center;
    background-repeat: no-repeat;
}

.button span.link {
    background-image: url(../images/icon-link.png);
}

<button type="submit" value="Continue" class="button">
   <span class="link">
      @SharedLocalizer["ContinueText"]
   </span>
</button>

为什么会这样？

Answer 1

我创建了一个codepen但它仍然有用

我补充说 background-size: 100%查看所有图片

请参阅codepen https://codepen.io/anon/pen/xjVbqQ

单击IOS设备后按钮图标消失

1 个答案: