WooCommerce 中的 blockOverlay 类样式覆盖

【问题标题】：blockOverlay class style override in WooCommerceWooCommerce 中的 blockOverlay 类样式覆盖
【发布时间】：2020-02-14 15:49:21
【问题描述】：

这个类在结账过程中被添加到购物车总数中，以表示在用户输入相关信息（如送货地址）时进行的更新。发生这种情况时，blockOverlay 类会以内联样式出现。我正在尝试覆盖这些样式，或者以某种方式对其进行编辑。任何人都知道我可以在哪里调整该元素的 CSS？我无法用我的外部 wordpress 样式表覆盖内联样式。

【问题讨论】：

标签： php css wordpress woocommerce

【解决方案1】：

您可以使用!important 覆盖内联样式。只需在样式表中为blockOverlay 元素的样式指定每个属性后添加!important，如下所示：

.blockOverlay {
     width: auto !important;
     display: block !important;
     //so on...
}

这是一个例子：

.blockOverlay {
  background: red !important;
  width: 300px !important;
  height: 50px !important;
}

&lt;div class="blockOverlay" style="height: 100px; width: 500px; background: blue;"&gt;&lt;/div&gt;

【讨论】：