首页 >web前端 >css教程 >尽管使用了 CSS 和 jQuery,为什么我的图像在 Chrome 和 IE9 中仍然有边框?

尽管使用了 CSS 和 jQuery,为什么我的图像在 Chrome 和 IE9 中仍然有边框?

DDD
DDD原创
2024-11-02 20:13:02479浏览

Why Does My Image Still Have a Border in Chrome and IE9 Despite Using CSS and jQuery?

修复 Chrome 和 IE9 中的图像边框问题

此线程解决了 Chrome 和 Internet Explorer 9 中图像周围出现明显边框的问题尽管尝试使用 CSS 和 jQuery 删除它。

提供的 CSS 代码:

<code class="css">outline: none;
border: none;</code>

禁用轮廓和边框,同时将 border=0 属性添加到所有图像标签。然而,边框仍然存在。

此问题的根本原因是 Chrome 中的一个错误,该错误忽略了边框:none;风格。作为解决方法,我们需要欺骗 Chrome 相信没有内容可显示。这是使用 CSS ID 块的解决方案:

<code class="css">#dlbutn {
    display:block;
    width:0px;
    height:0px;
    outline:none;
    padding:43px 51px 43px 51px;
    margin:0 auto 5px auto;
    background-image:url(/images/download-button-102x86.png);
    background-repeat:no-repeat;
}</code>

这将图像的大小设置为零,但包括实际图像尺寸的填充。 Chrome 被有效地欺骗,认为没有图像,同时为按钮的背景图像留有空间。此解决方案消除了 Chrome 和其他浏览器中不需要的轮廓和边框。

以上是尽管使用了 CSS 和 jQuery,为什么我的图像在 Chrome 和 IE9 中仍然有边框?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn