css - 使用 css 删除产品描述中图像的底部边距？

Question

我添加了“添加到购物车”按钮图像，我在上面放了一个结账链接，图像位于我的产品描述的顶部，但图像和文本之间的间距太大...这是我以前的代码删除底部边距(我使用了检查元素和未检查的底部边距，它看起来很完美)

<img class="alignnone size-full wp-image-623" src="(your image url)" alt="" width="383" height="70" />
<ul>
    <li>FREE WORLDWIDE SHIPPING</li>
    <li>Delivery time: 9 to 18 days</li>
</ul>

<style>
img {
  margin: 0;
  margin-bottom: 0 !important;
}
li,
ul {
  margin: 0;
  margin-bottom: 0 !important;
  line-height: 8px !important;
}
</style>

下边距绝对是问题的根源。我正在使用 SiteOrigin CSS 插件来编辑我的 css，但上面的代码没有按预期工作，you can see how it looks with code above and when I uncheck bottom margin使用检查元素(即使我删除了代码的文本部分，文本也会变形)。

和here you can see how the code looks before and after它保存在 SiteOrigin CSS 中(也有一些错误)。

Answer 1

正如您已经说过的:“SiteOrigin CSS 插件”是您正在使用的东西。

但是所有带有“<”和“>”的标签都是HTML标签，与CSS(Cascading Style Sheets)无关。 HTML 是一种标记语言，它定义标记而不是设计。

编辑:尝试此代码并删除您刚刚发布的所有内容。

img.size-full.alignnone{
  margin-bottom: inherit;
}

tl；博士；您将 HTML 代码放入 CSS 插件中。删除它!