在Chrome中移除sprite图片周围的边框 [英] Remove border around sprite image in Chrome

问题描述

第一次使用这种技术，似乎无论什么属性，我尝试分配边框将不会在Chrome中消失。其他浏览器都没问题。我试过outline：none，border：0;等等也试图在图像周围添加一个彩色边框，注意到黑色边框仍然在彩色边框内。似乎不想离开。

First time using this technique, seems that regardless what attributes I try to assign the border will not go away in Chrome. Other browsers are fine. I've tried outline:none, border:0; etc, etc. Also tried adding a colored border around the image, and noticed the the black border was still there within the colored border. Doesn't seem to want to go away.

解决方法或建议非常感激。

Work-around's or advice much appreciated.

.share-link {
display: block;
width: 41px;
height: 32px;
text-decoration: none;
background: url("link-icon.png");
}

.share-link:hover {
background-position: -41px 0;
}


<a title="Share this Link" href="#"><img class="share-link"></a>

推荐答案

这是因为您使用 img 标记，不带 src 属性。 Chrome本质上是指示没有任何内容的容器的大小。

It's because you are using an img tag with no src attribute. Chrome is essentially indicating the size of the container with nothing in it.

如果您不想在锚标记之间放置图片，请不要使用图片标记。

If you don't want to place an image between the anchor tags, then don't use an image tag. It's not necessary to place anything between the tags.

演示在这里。

Demo here.

这篇关于在Chrome中移除sprite图片周围的边框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！