html - 图片边框在 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。我将 ui-corner-all 类添加到 img 元素，但问题仍然存在:未显示边框。 (在这种情况下，IE9 可以正确显示圆 Angular 边框)。

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

Answer 1

正确的使用方法是

img{
border:1px solid #bbb;
}

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