自定义 CSS 编辑答案

【问题标题】：Custom CSS edit自定义 CSS 编辑
【发布时间】：2019-11-01 23:38:29
【问题描述】：

我是建筑网站的新手，我不懂很多编码，但我需要问这个问题（我想这很简单，但对我来说并非如此）。我的主页上有产品，它们有边框。当我单击检查并删除“border-style：solid;”上的勾号时，我需要删除边框没关系。我在自定义 CSS 中尝试了很多不同的代码，但都没有奏效。我想我不能上正确的课。一些例子：

.elementor-52 .elementor-element.elementor-element-c51ed78 .eael-product-grid .woocommerce {
    border-style: none;
}

或

.product .type-product .post-30 .status-publish .first .instock .product_cat-packages 
.product_cat-test .has-post-thumbnail .shipping-taxable .purchasable .product-type-simple {
    border-style: none;
}

感谢您的宝贵时间。

【问题讨论】：

没人知道你的代码长什么样。你定义了什么HTML？哪些类去哪些元素？照原样没有人能够回答您的问题，因此请添加更多输入。
您的尝试都不匹配屏幕截图中的选择器。只需复制该类列表即可。
标记为没有最低可重现示例，我们需要查看您的代码才能评估如何解决此问题。请至少显示 HTML。

标签： css wordpress woocommerce

【解决方案1】：

边框在您的列表元素上，类为product

要摆脱边框，您可以使用：

li.product{
 border-style: none !important;
}

您也可以使用border: none;或border-width: 0;

“!important”会覆盖任何样式，即使它们嵌套更多。

它应该是这样的：

如果 li.product-style 不存在，您的 css 文件中出现了错误，或者：旧的 css-style 仍在您的缓存中。在 Chrome 中，您可以通过按 ctrl + F5 重置缓存并重新加载

【讨论】：

我已经尝试过了，但它不起作用。我还有边界。
你需要找出边框在哪些元素上。然后你可以覆盖它。对于您提供的屏幕截图中的元素，该类似乎是正确的。尝试使用类产品检查列表元素。样式现在应该在那里。如果它不存在，您可以尝试重置缓存。
.elementor-52 .elementor-element.elementor-element-c51ed78 .eael-product-grid .woocommerce ul.products li.product {border-style: none !important; } 你的意思是这样吗？这也不起作用:(
它工作正常，谢谢！我在 FireFox 中尝试并且它正在工作，但仍然使用 ctrl + f5 我无法在 chrome 中看到它。谢谢你的时间！！！