如何在不破坏布局的情况下在图像周围添加边框？

Question

网站：is here

图片html：

<img alt="" src="UserFiles/Image/galerie/12970854473D-Eco-60.jpg">

我将border: 2px solid black;添加到图片

布局中断...

Answer 1

我能看到的问题唯一直接的解决方案是

outline: 2px solid black

布局中立。但是，doesn't work in IE < 8。

Answer 2

为了记录，另一种选择：

border: 2px solid black;
margin:-2px;

首先向所有边添加2px，然后用负边距将它们拉回来。

Answer 3

您可以使用CSS剪辑，并在剪裁的图像周围应用边框;

我尝试使用margin：-2px，但它对我不起作用。

警告，CSS剪辑非常直观，虽然它与边距和填充共享类似的简写，但与边距或填充相比，它的像素值分配极为不同。

以下是一些有用的链接;

1. 涵盖大纲和负边距修复 http://css-tricks.com/2368-image-rollover-borders-that-do-not-change-layout/

2. CSS剪辑 http://www.seifi.org/css/creating-thumbnails-using-the-css-clip-property.html