5

我无法从图像中删除边框。我用不同的属性尝试了很多次。仍然看到白色边框。如果您对导致问题的原因有任何建议 - 请向我解释。我是个新手。

<head>
    <style>
    img{
    border : none;
    text-decoration: none;
    }
    #forum
    {
        background:url(forum_button.png) 0px 0px no-repeat; 
        width: 300px; 
        height: 81px;

    }
    #forum:hover
    {
        background:url(forum_button.png) -300px 0px no-repeat; 
        width: 300px; 
        height: 81px;
    }
    #facebook
    {
        background:url(social_buttons.png) 0px 0px no-repeat;
        width: 29px; 
        height: 29px;
    }
    #facebook:hover
    {
        background:url(social_buttons.png) 0px -33px no-repeat;
        width: 29px; 
        height: 29px;
    }
    #twitter
    {
        background:url(social_buttons.png) -31px 0px no-repeat;
        width: 29px; 
        height: 29px;
    }
    #twitter:hover
    {
        background:url(social_buttons.png) -31px -33px no-repeat;
        width: 29px; 
        height: 29px;
    }
    </style>
    </head>
    <body style="background:url(landing.png) no-repeat top #111111; width: 1280px; height: 1024px; border:0;">
    <a href="#"><img id="forum" /></a>
    <div id="social">
    <a href="#"><img id="facebook"></a>
    <a href="#"><img id="twitter"></a>
    </div>
4

6 回答 6

10

这是因为 img 标签必须有一个带有正确链接的 src="" 否则它将像您的情况一样将图像显示为背景（因为 img 上的 css ）和顶部的损坏图像

="#"><img id="facebook"></

这不是边框，你看到的是破碎的图像边框。

如果要保留代码，请将 img 标签更改为 div ..

于 2013-09-23T14:34:49.503 回答
1

改变

border : none;

到

border : none !important;

这样它将覆盖所有父声明，因此必须工作。

于 2013-09-23T14:34:39.280 回答
0

也许边界不是 html 给出的，而是在你的 img 中？

因此，在 Photoshop 等图像程序工具中打开您的图像，然后缩放到有边框的地方，看看是否有边框。

于 2013-09-23T14:26:08.937 回答
0

这可能是因为您的标签上没有src属性。img在您的情况下，我建议使用透明像素作为 src。

于 2013-09-23T14:29:19.060 回答
0
  • 使用具有适当高度和宽度的 img src 插入图像。
  • 使用画图或其他工具编辑图像。例子。
  • 确保您的原始图像没有任何边框，如果它只是选择并裁剪图像。
于 2013-09-23T14:34:23.513 回答
0

您正在尝试使用可以在悬停事件上重新定位的背景图像在链接上设置图标图像。

最简单的方法如下。

HTML 可以很简单：

<a class="test" id="test" href="#"></a>

并应用以下 CSS：

.test {
    background: beige url(http://placekitten.com/50/50) center center no-repeat;
    display: inline-block;
    width: 50px;
    height: 50px;
    border: none;
}

a在链接（标签）上应用背景图像而不是img标签，这不是必需的。

参见演示：http: //jsfiddle.net/audetwebdesign/qAeHL/

于 2013-09-23T14:46:32.810 回答