如何刪除 Chrome 和 IE9 中不需要的圖片邊框？

刪除 Chrome 和 IE9 中的圖像邊框

網頁設計的挑戰之一是確保在不同瀏覽器上保持一致的視覺呈現。但是，可能會出現某些問題，例如 Chrome 和 IE9 中圖片周圍會出現不必要的邊框。

要消除此邊框，您可能會嘗試使用 CSS 屬性，例如 border: none 和 border: none，但無濟於事。這是因為 Chrome 有已知的錯誤，會忽略邊框：none style。

解決此問題的關鍵是欺騙 Chrome 將圖像視為沒有尺寸。建立一個寬度和高度為 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 和 IE9 中不需要的圖片邊框？的詳細內容。更多資訊請關注PHP中文網其他相關文章！