0

CSS スプライトを使用しているサイトをやり直しています。また、削除できないいくつかのタグでスプライトを使用しています。

したがって、タグは CSS-background-image と適切な背景位置を取得します。正常に動作します。これは Firefox で表示され続けたため、alt 属性を削除する必要がありました。良くありませんが、大丈夫です。

私の問題: Chrome では、画像の周りにかすかな輪郭ができてしまいます。最初はボーダーかと思いましたが、アウトラインだと思います。

かすかな境界線をCSS outline: 3px solid blue すると、3pxの実線の青になります...しかし、設定してoutline: 0; も何も起こりません。

その他のコード: HTML

<img class="ui-li-icon ui-li-thumb iconComments" />

CSS

.ui-icon, .iconComments, .iconMail, .ui-icon-searchfield:after {
    background:  #FFFFFF  /*{global-icon-color}*/;
    background:  transparent  /*{global-icon-disc}*/;
    background-image:  url(img/sprite.png)  /*{global-icon-set}*/;
    background-repeat: no-repeat;
    -moz-border-radius:  9px;
    -webkit-border-radius: 9px;
    border-radius: 9px;
    } 
.iconComments {
background-position:    -36px 50%;
    }
.iconMail {
background-position:     2px 50%;
    }
.iconComments, .iconMail {
height: 20px; 
width: 20px;
    }

アウトライン/境界線がどこから来ているのか、それを削除する方法はありますか?

ありがとう

4

3 に答える 3

2

この問題は、イメージ タグ内に src 属性がないことが原因である可能性があります。

于 2012-04-29T17:52:09.517 に答える
0

画像を絶対に配置できる場合は、CSSclipプロパティを使用してスプライトをフォアグラウンドで直接使用できます。

于 2011-11-02T00:44:31.910 に答える