html - CSS:使图像填充不影响阴影

Question

所以，我的 css 很简单，但问题很大...

.separator a img {
  width: 100%;
  height: auto;
  padding: 12px;
}

结果是:this

正如您在图像上看到的那样，阴影显示在图像的填充上，但我希望它显示在图像上。

我想做this还要保持填充。

有什么想法吗？

Answer 1

您正在寻找 margin CSS property .填充位于边框内部，而边距位于外部。

由于阴影是(我假设)通过 box-shadow 应用的，因此边距将在它之外并且阴影将直接显示在图像旁边。

尝试将 padding: 12px 更改为 margin: 12px。