0

を使用して画像の周囲に境界線を追加します

img
{
    border-color: #bbbbbb;
}

画像は次のようにhtmlで定義されます

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

ブラウザの画像プロパティによると、画像サイズは130x130ピクセルです。FirefoxとChromeでは境界線は表示されません。

Firebug inspect要素の[スタイル]タブには、スタイルが適切に適用されているように表示されます。

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では、境界線が正しく表示されます。Jqueryuiのデフォルトのstlyeが使用されます。ui-corner-allクラスをimg要素に追加しましたが、問題が解決しません。境界線が表示されません。(この場合、IE9は丸みを帯びた境界線を正しく表示します)。

ChromeとFireFoxで画像の周りに丸みを帯びた境界線を表示するにはどうすればよいですか?

4

2 に答える 2

2

それを使用する正しい方法は

img{
border:1px solid #bbb;
}

ここで、最初のパラメーターは境界線の幅を定義し、2番目のパラメーターは境界線のタイプを定義し、3番目のパラメーターは境界線の色です。あなたはここで国境について読むことができます

于 2013-02-10T21:39:25.757 に答える
1

試す:

display: block;
border: 1px solid #bbbbbb;
于 2013-02-10T21:37:24.377 に答える