如何覆盖！重要风格并在价格旁边显示“添加到购物车”按钮？

Question

我在页面上添加到购物车按钮时遇到问题。例如here“添加到购物车”由于某种原因未显示。检查CSS类时，我会看到这个CSS规则：

id__| country__ | city_id  |      name       | __lang__ | _order_
1   | 1000      |    1     |  Dnipropetrovsk |   en     |    1

这是带有按钮的那部分的整个HTML：

SELECT * FROM `cities` 
INNER JOIN `translates` ON `cities`.`id` = `translates`.`city_id` 
ORDER BY `order`
GROUP BY `city_id`

将此代码插入自定义CSS时，不能覆盖该重要规则，并将颜色更改为其他。这里的一些，如何覆盖它并改变颜色，并在价格旁边稍微移动一下？

Answer 1

你必须在你要覆盖的样式旁边使用一个包含！important的选择器，并使它比你同时覆盖的选择器更具体。

Answer 2

这个CSS调整我自己解决了我的问题：

.products .product .add_to_cart_button {
display: inline-block;
background: #070bf7 !important;
top:360px;
left:30px;
color:#fff;
}


.woocommerce ul.products li.product .button {
 margin-top:370px;
margin-left:70px;
opacity:1;
}