以下のコードでは境界線が削除されていません。これは image sprite です。style と border 0 を使用して境界線を削除する方法をいくつか試しましたが、使用できません。
<style>
img.home{width:40px;height:32px;
background:url(share.png) 0 0;
border-style: none;}
img.next{width:40px;
height:32px;background:url(share.png) -36px 0;
border-style:none;}
</style>
<a href="http://www.yahoo.com/">
<img class="home" border="0">
</a>
<img class="next" border="0"/>
画像にはデフォルトの境界線があり、画像がダウンロードされたときにのみ消えます。その画像はsrc、画像の属性から来ています。src が設定されていない場合、画像はダウンロードされず、境界線は永遠にそこに残ります-まさにあなたのケースです。
通常の img タグは次のようになります。
<img src="/something.jpg" />
あなたのものは次のようになります：
<img />
css の background-image を介して画像を追加しています。それが行われるべきではない。背景画像を追加できますが、通常は他の目的のためです。（下部の脇を確認してください）。
背景画像を削除し、画像の src 属性に画像の場所を配置してみてください。このような：
<img class="next" src="/share.png" />
画像に境界線がないことがわかります。
余談
img 要素に背景画像を追加する場合、通常は imgsrcが設定されていない場合のプレースホルダー画像を提供します。ブログのコメント セクションのアバターについて考えてみてください。
また
、スプライトを作成するときは、divs ps ems などを使用できます。覚えておいてください、 はbackground-imageどの要素にも適用できます!
html タグが<img class="somthing" />であり、クラス「something」で画像の背景位置を定義したとします。
画像スプライトから特定の画像をより正確に選択すると、その画像がある特定の位置になります。CSSの背景位置を使用して画像を取得するクラスは適切です。
境界線を削除する簡単な解決策は、imgタグをdiv.
img背景の位置に応じて画像を取得する場合、タグを使用する必要があるのはなぜですか。
のようにhtmlを書くだけです...<div class="next" ..>
外部ファイルを使用しない場合は、base64 の非常に小さな透明な画像を使用できます
<img class="next" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"/>
JOPLOmacedo が正しかったことがわかりましたが、背景を削除する必要はなく、srcタグを使用するだけです。JSFIDDLE . （画像については申し訳ありませんが、をテストするために必要でしたsrc）
HTML:
<a href="http://www.yahoo.com/">
<img class="home" src="http://jsfiddle.net/img/logo.png" border="0"/>
</a>
<img class="next" src="http://jsfiddle.net/img/social-icons/facebook_16.png" border="0"/>
CSS:
img.home{width:40px;height:32px;
border: none; background:url(http://farm1.staticflickr.com/111/315308766_163c08db38.jpg) 0 0;}
img.next{width:40px;
height:32px;
border:none; float: right;
background:url(http://farm1.staticflickr.com/111/315308766_163c08db38.jpg) -36 0;}