css - 保留元素之间的空间

Question

我有一组元素一个接一个地放置。如果用户单击一个元素，则会为其设置 1px 宽度的边框。结果，其他 img 元素被移动。

如何在每个 img 元素周围保留 1px 宽度空间？

Answer 1

要么使用margin（MDN）

margin: 1px;

或将border-color（MDN）设置为transparent并切换颜色

border-color: transparent;

Answer 2

当您添加边框时，您也可以添加margin: -1px;到元素中（确保在关闭边框时正确反转该过程）

或者给所有border: 1px solid transparent（认为他们现在都支持）然后你只需要改变边框颜色。您可以修改，border-color: rgba(222,0,0,0);然后修改rgba(222,0,0,1)活动元素，其中 a 是透明度。但是，rgba在 IE atm 中并没有得到很好的支持。