首页 >web前端 >css教程 >如何删除 Chrome 和 IE9 中的持久图像边框?

如何删除 Chrome 和 IE9 中的持久图像边框?

DDD
DDD原创
2024-11-03 08:31:29779浏览

How to Remove Persistent Image Borders in Chrome and IE9?

在 Chrome/IE9 中删除难以捉摸的图像边框

在 Chrome 或 IE9 中显示图像时,尽管设置,您可能会遇到持续的细边框CSS 中的“outline: none”和“border: none”。此问题的出现是由于 Chrome 的一种特殊行为覆盖了“border: none”。

为了解决这个问题,您可以采用一种巧妙的技术,将图像宽度和高度设置为 0px,同时用相应的像素值填充它。到所需的按钮尺寸。考虑以下 CSS 示例:

<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 中显示没有难看边框的图像。

以上是如何删除 Chrome 和 IE9 中的持久图像边框?的详细内容。更多信息请关注PHP中文网其他相关文章!

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