html - 在图像周围添加透明边框

Question

我正在使用 phpThumb 覆盖几个图像，这利用了 GD 库。为了使此功能起作用，图像的大小必须相同。因此，当用户上传图片时，我必须验证尺寸。最后，为了让它正确显示，我需要在图像周围添加一个透明边框，以便底层图像大小相同。

所以我不能使用 CSS 方法。我不知道是否有其他 GD 调用可以做到这一点，但该网站目前已关闭（http://www.libgd.org/）。

你会推荐什么方法来添加透明边框？

Answer 1

CSS 中的边距就像一个透明边框。但是对于您的问题，有更好的方法：

首先，如果您使用的是 phpThumb，您可以自动调整图像大小，因此无需验证图像大小：

<?php

    require_once 'path/to/ThumbLib.inc.php';

    try
    {
         $thumb = PhpThumbFactory::create('/path/to/image.jpg');
    }
    catch (Exception $e)
    {
        // handle error here however you'd like
    }
    $thumb->resize(100, 100);
    $thumb->show();
?>

您可以在此处找到更多详细信息。

我不明白为什么你需要一个边框。但是，如果您想在图像上使用叠加层，则无需为图像添加边框以适合叠加层。如果您需要在图像上叠加，您可以执行以下操作：

 <div class="container">
   <img src="path to your image" />
   <span class="overlay"></span>
 </div>

并应用一些风格：

.container{ // the same size as your image
  width:100px;
  height:100px;
}

.overlay{
   position: absolute;
   top:0;
   left: 0;
   width:100%;
   height:100%;
   background: ...
   ...
}