CSS背景：透明url（）不显示img

我想用PNG图像替换WooCommerce的“添加到购物车”按钮

我在我的子主题中使用以下CSS来实现这一点：

.woocommerce .single_add_to_cart_button, .woocommerce ul.products li.product .button {
  background: transparent url('http://www.tempertemper.com.au/test/wp-content/themes/temper/images/buy.png') no-repeat !important;
  opacity: 0 !important;
  width: 109px;
  height: 46px;
}

---

我将不透明度设置为0，以消除文本“添加到购物车”

但是，这只生成具有透明背景的元素，而不生成背景图像：

该按钮直接位于产品数量字段的右侧：

---

为什么背景图像不显示？谢谢。

您的不透明度设置为零-这就是您无法看到图像的原因。尝试使用

opacity: 1 !important;

---

不透明度文档：

更改

不透明度：1！重要的

和要删除

添加到购物车

文本输入按钮，请删除样式中

添加到购物车之间的文本。css（第151行）将不透明度设置为0：

.woocommerce .single_add_to_cart_button, 
.woocommerce ul.products li.product .button {
   background: transparent url('http://www.tempertemper.com.au/test/wp-content/themes/temper/images/buy.png') no-repeat !important;
   opacity: 0 !important;
   width: 109px;
   height: 46px;
}

---

我将不透明度设置为0，以消除文本“添加到购物车”。我将不得不找到一种方法来摆脱文本。我通过使用