图像边框在chrome和firefox中消失，但在IE中出现

Question

使用以下方法在图像周围添加边框

img
{
    border-color: #bbbbbb;
}

图像以html之类定义

    `<img src="/Thumb?product=CPU-EP0520EL01">`

根据浏览器的图像属性，图像大小为130x130像素。 在Firefox和Chrome中，不会出现边框。

Firebug检查元素的“样式”选项卡显示样式正确应用：

img {
    border-color: #BBBBBB;
}
.category-list li a, ul#category-list li .button {
    font-size: 11px;
}
a:link, a:visited {
    color: #A80000;
    font-weight: bold;
}
.category-list li {
    text-align: center;
}
.category-list {
    list-style: none outside none;
}
body {
    font-family: Helvetica,Arial,sans-serif;
    font-size: 12px;
} 

在Internet Explorer 9中，边框会正确显示。 jQuery ui默认使用stlye。 我向img元素添加了ui-corner-all类，但问题仍然存在：未显示边框。 （在这种情况下，IE9会正确显示圆形边框）。

如何在Chrome和FireFox中显示图像周围的圆形边框？

Answer 1

正确的使用方式是

img{
border:1px solid #bbb;
}

其中第一个参数定义边框的宽度，第二个参数定义边框的类型，第三个参数是边框的颜色。 您可以在这里阅读有关边框的信息

Answer 2

尝试：

display: block;
border: 1px solid #bbbbbb;