Woocommerce 仅更改单个产品页面按钮 css

Question

我在单一产品页面上有一个添加到购物车按钮，我想改变它的外观。我不想更改我网站上的其他按钮。

.woocommerce #content input.button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce-page #content input.button,
.woocommerce-page #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button {
    background: #f2a700 none repeat scroll 0 0 !important;
    border: 2px solid #f2a700;
    color: #fff !important;
    margin-top: -4px;
    width: 57%;
}

Answer 1

使用每个 WooCommerce 单个产品 页面的 <body> 标签中包含的 single-product class：

CSS

.single-product .single_add_to_cart_button {

    /* Style your button here */

}

Woocommerce 仅更改单个产品页面按钮 css

Woocoomerce only change single product page button css

css

wordpress-theming

woocommerce