0

我正在重做一个使用 CSS 精灵的网站。我也在使用带有一些标签的精灵，我无法删除这些标签。

所以标签得到一个 CSS-background-image 和适当的背景位置。工作正常。我不得不删除 alt 属性，因为它一直显示在 Firefox 上。不是很好，但还可以。

我的问题：在 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

通常这是由边框属性引起的。我知道你说你认为这是大纲，但你在你的 img 课上试过这个吗......

.imgClass
{ 
border-style: none; 
text-decoration: none; 
}

或这个

.imgClass
{
border:0;
}
于 2011-11-02T00:29:13.267 回答
0

如果您可以绝对定位图像，则可以使用 CSSclip属性直接在前景中使用精灵。

于 2011-11-02T00:44:31.910 回答