如何更改一个特定的 CSS 类答案

【问题标题】：How to change one specific CSS class如何更改一个特定的 CSS 类
【发布时间】：2018-09-02 01:13:53
【问题描述】：

我有一个问题，我通过 Wordpress 开发了一个网站，并希望以一种方式设置所有产品价格的样式，并以另一种方式设置小计、税收和总计的样式。它们都属于 woocommerce-Price-amount 的 CSS 类。无论如何，我只能针对 tr“cart_item”中的那些吗？谢谢！

 <table class="shop_table woocommerce-checkout-review-order-table" style="border-color: rgb(255, 255, 255);">
<thead style="background-color: rgb(0, 0, 0);">
    <tr>
        <th class="product-name" style="border-color: rgb(255, 255, 255); color: rgb(255, 255, 255);">Product</th>
        <th class="product-total" style="border-color: rgb(255, 255, 255); color: rgb(255, 255, 255);">Total</th>
    </tr>
</thead>
<tbody>
                        <tr class="cart_item">
                    <td class="product-name" style="border-color: rgb(255, 255, 255);">
                        Autumn Leaf Shirt - Large&nbsp;                          <strong class="product-quantity">× 2</strong>                                                  </td>
                    <td class="product-total" style="border-color: rgb(255, 255, 255);">
                        <span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>70.00</span>                       </td>
                </tr>
                    </tbody>
<tfoot>

    <tr class="cart-subtotal">
        <th style="background-color: rgb(0, 0, 0); border-color: rgb(255, 255, 255); color: rgb(255, 255, 255);">Subtotal</th>
        <td style="border-color: rgb(255, 255, 255);"><span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>70.00</span></td>
    </tr>




                                <tr class="tax-total">
                <th style="background-color: rgb(0, 0, 0); border-color: rgb(255, 255, 255); color: rgb(255, 255, 255);">Tax</th>
                <td style="border-color: rgb(255, 255, 255);"><span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>0.00</span></td>
            </tr>


    <tr class="order-total">
        <th style="background-color: rgb(0, 0, 0); border-color: rgb(255, 255, 255); color: rgb(255, 255, 255);">Total</th>
        <td style="border-color: rgb(255, 255, 255);"><strong><span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>70.00</span></strong> </td>
    </tr>


</tfoot>

【问题讨论】：

标签： javascript css wordpress

【解决方案1】：

是的！您可以将woocommerce-price-item 内的cart_item 专门定位为：

.cart_item .woocommerce-Price-amount{ /**Your Properties here**/ }

这只会将您的属性应用于类 woocommerce-Price-amount 的元素内的类 cart_item 的元素

基本上在 CSS 中，您可以在 foo 中访问 bar：

.foo .bar{ }

【讨论】：