在IE 10兼容性视图中删除蓝色边框

时间:2013-05-30 02:10:32

标签: html css cross-browser hyperlink internet-explorer-10

如何删除或只是不显示每个锚点与图像的边框链接?顺便说一句,浏览器设置处于兼容模式。来自其他问题的答案不足以解决我的问题。我想因为它只适用于较低版本的IE。

修改

我正在创建一个自定义共享按钮,我的客户需要我。

<div>
    <a onClick="window.open('https://twitter.com/intent/tweet?original_referer=#shareLink#&text=#shareTitle#&tw_p=tweetbutton&url=#shareLink#','sharer','toolbar=0,status=0,width=548,height=325');" href="javascript: void(0)">
        <img height="20" src="/images/chicklets/Twitter_Tweet.png" />
    </a>
</div>
<div>
    <a onClick="window.open('http://www.facebook.com/sharer.php?s=100&amp;p[title]=#shareTitle#&amp;p[summary]=#shareDesc#&amp;p[url]=#shareLink#&amp;p[images][0]=images/Telos.jpg','sharer','toolbar=0,status=0,width=548,height=325');" href="javascript: void(0)">
        <img height="20" src="/images/chicklets/FaceBook_Share.png">
    </a>
</div>

<div>
    <a onClick="window.open('http://www.linkedin.com/shareArticle?mini=true&url=#shareLink#&title=#shareTitle#&summary=#shareDesc#','sharer','toolbar=0,status=0,width=548,height=325');" href="javascript: void(0)">
        <img height="20" src="/images/chicklets/LinkedIn_Share.png">
    </a>
</div>      

<div>
    <a onClick="window.open('https://plus.google.com/share?url=#shareLink#','sharer','toolbar=0,status=0,width=548,height=325');" href="javascript: void(0)">
        <img height="20" src="/images/chicklets/Google_PlusOne.png">
    </a>
</div>

CSS

a {
    outline : none;
    text-decoration: none;
}
a img {
    outline : none;
}
img {
    border : 0;
    border-style: none;
}
div {
    float: left;
    padding-right: 10px;
}

这是IE10的样子:

enter image description here

3 个答案:

答案 0 :(得分:8)

怎么样,尝试添加这样的东西

<img src="blah" style="border-style:none;">

答案 1 :(得分:0)

我通常将此作为我在CSS中正常默认设置的一部分:

img {border: none;}

这不会对其他浏览器产生负面影响,并且如果您将其置于通用css文件的顶部附近,则很容易在以后重写:

img {border: none;}
img.some-class {border: 1px double blue}

增加的特异性会为你的形象添加一个丑陋的边框,就像IE喜欢做的那样。

答案 2 :(得分:0)

我遇到了与IE10完全相同的问题。我刚刚为a标签设置了CSS规则,并将文本颜色设置为白色。这将从锚图像周围移除蓝线。