0

我有许多白色背景上的物品图像。有些图像比其他图像宽。我想在图像周围添加一个边框，但希望边框是固定宽度（比如 100 像素）

基本上我希望有可变数量的填充（在图像和边框之间），以便图像宽度 + 填充（左右）= 100px

这是我正在使用的代码：

    <td style = "vertical-align: middle; border-left:">
      <div style="border: 1px solid #DDDDDD; width:200px; text-align:center">
        <a href="/styles/15"><img alt="blah" class="thumbnail" src="blah" style="vertical-align: middle; border:none; height:65x; text-align:center" /></a>
       </div>
    </td>
4

3 回答 3

1

首先请避免使用内联样式

看演示

使用 CSS 作为： 

.imageBox {border: 1px solid #DDDDDD; width:200px; text-align:center}
.image {vertical-align: middle; border:none; height:65x; text-align:center}

和 HTML 为：

<td class="imageBox">
    <div >
        <a href="/styles/15"><img alt="blah" class="thumbnail" src="http://upload.wikimedia.org/wikipedia/commons/1/17/MetroLigeroMad_logo_1.png"  /></a>
    </div>
</td>
于 2012-10-08T09:58:39.600 回答
0

你可以这样做：

<div class="imageholder">
   <img src="images/yourpic.jpg">
</div>

你接下来要做的就是把边框放在 div 上。接下来你要做的就是使 div100px变宽。

于 2012-10-08T07:05:12.810 回答
0

嗨，现在定义这个 css

img{vertical-align:top;}

现场演示

于 2012-10-08T07:29:05.090 回答