設定路徑:版面>自訂CSS商店樣式。



語法如下:


/*電腦版*//*商品頁*/

/*加入購物車*/

body.product-product a#button-cart{

 background:deepskyblue; /*背景顏色*/

 color:linen; /*文字顏色*/

 border:5px solid #c2e3ef !important; /*框線設定*/

}

/*直接購買*/

body.product-product #button-quick-checkout{

 background:deepskyblue; /*背景顏色*/

 color:linen; /*文字顏色*/

 border:5px solid #c2e3ef; /*框線設定*/

}

 

/*手機版*//*商品頁*/

@media only screen and (max-width: 768px), only screen and (max-device-width: 667px) and (min-device-width: 375px) and (orientation: portrait), only screen and (max-device-width: 736px) and (min-device-width: 414px) and (orientation: portrait) {

 

 /*加入購物車*/

 body.product-product a#button-cart{

  background:#ff0068; /*背景顏色*/

  color:linen; /*文字顏色*/

  border:5px solid #c2e3ef !important; /*框線設定*/

 }

 /*直接購買*/

 body.product-product #button-quick-checkout{

  background:#ff8300; /*背景顏色*/

  color:linen; /*文字顏色*/

  border:5px solid #c2e3ef; /*框線設定*/

 }

 

}

----------------------------------------------------------

【同場加映】


/*下一步|計算運費*/

.checkout-cart #button-next-checkout {

    background:#000;

    border-color:#000;

}



/*下一步|進行結帳*/

#terms-wrapper #button-payment-method{

    background:#000;

    border-color:#000;

}