如何在元素周围形成均匀的边界？

Question

假设你有一个div包装图像。你如何设置div的样式，以便在图像的四个边上创建一个宽度均匀的边框？

Answer 1

1. 如果div不必在那里，您也可以给img一个实际的边框并完成它。指定一个宽度值会在所有边上创建一个同样粗的边框。

   img {
       border: 3px solid blue;
   }
   

   jsFiddle preview

2. 否则，如果您因任何原因需要使用div作为边框，请将其设为内联块，并使img成为块。然后提供div填充或提供img边距。

   div {
       display: inline-block;
       background-color: blue;
       padding: 3px;
   }
   
   img {
       display: block;
   }
   

   jsFiddle preview