更改按钮的颜色时图标会消失吗？

Question

NSFW关于链接的警告

我有网站：

link

在此页面上，您会发现add to cart button为橙色

按钮有一个图标(a shopping cart) ...仅当您删除以下代码时才会显示“跟踪”图标。

请删除下面的代码，您会看到图标。

.button.button span{
background:red !important;}

即使按钮是橙色，如何显示这些图标？

谢谢！

Answer 1

使用background-color代替background，因为字体图标是通过背景属性生成的。

删除

.button.button span {
   background: red !important;
}

然后在此css属性中添加它：

.product-view .add-to-cart button.button span span {
  line-height: 52px;
  font-size: 14px;
  text-transform: capitalize;
  padding: 0 20px 0 70px;
  background: url('../images/icon_cart_product.png') 17px 50% no-repeat;
  background-color: red !important;
}