0

我无法摆脱社交图标周围的框架（请参阅 jsfiddle：http: //jsfiddle.net/r7g8r/2/）。我试过了Img border: 0，“没有”但没有成功。怎么了？谢谢。

CSS

img {
    max-width: 100%;
    border: 0;
    -ms-interpolation-mode: bicubic;
}
.social {
    position: absolute;
    right: 50px;
    top: 13px;
    text-align: right;
}


.social ul {
    margin: 0;
    padding: 0;
    list-style-type: none;

}
.social li {
    margin: 2px;
}

.fbbl, .fbbw, .linkedinbl, .linkedinbw, .vimeobl, .vimeobw{
    background: url(images/sprites.png) no-repeat;

}



.fbbw{
    background-position: -51px -1px ;
    width: 34px;
    height: 35px;
}

.fbbw:hover{
    background-position: -1px 0;
    width: 34px;
    height: 34px;
}



.linkedinbw{
    background-position: -51px -103px ;
    width: 34px;
    height: 35px;
}
.linkedinbw:hover{
    background-position: 0 -50px ;
    width: 34px;
    height: 34px;
}


.vimeobw{
    background-position: -49px -52px ;
    width: 34px;
    height: 35px;
}
.vimeobw:hover{
    background-position: 0 -103px ;
    width: 33px;
    height: 34px;
}

HTML

<div class="social">
          <ul>
            <li><img class="fbbw"></li>
            <li><img class="linkedinbw"></li>
            <li><img class="vimeobw"></li>
            </ul>
        </div>
4

2 回答 2

1

我不确定究竟是什么导致了这种行为，但你不应该<img>在这里使用。<img>没有是无效的src。

你应该<div>改用。请参阅此版本：http: //jsfiddle.net/r7g8r/3/。它没有这个边框，并且在 Chrome 和 Firefox 中都可以使用（而您的版本在 FF 中不起作用）。

于 2013-06-02T16:41:12.013 回答
0

尝试

.social ul li img
{
border-width:0px;
}
于 2013-06-02T16:26:32.517 回答