首頁 >web前端 >css教學 >如何去除帶有自訂圖像的按鈕的灰色邊框?

如何去除帶有自訂圖像的按鈕的灰色邊框?

Patricia Arquette
Patricia Arquette原創
2024-10-28 11:36:38499瀏覽

How to Remove the Gray Border from Buttons with Custom Images?

刪除按鈕的邊框

用自訂影像取代預設影像來自訂按鈕時,通常會遇到周圍持續存在的灰色邊框圖像。可以刪除此邊框以實現乾淨無縫的按鈕設計。

解決方案

要刪除按鈕的灰色邊框,只需將以下CSS 樣式加入按鈕代碼:

<code class="css">padding: 0;
border: none;
background: none;</code>

範例程式碼

<code class="html"><button style="padding: 0; border: none; background: none;">
  <img src="/path/to/image.png">
</button></code>

演示

有關現場演示,請參閱以下URL:

https://jsfiddle.net/ Vestride/dkr9b/

透過套用這些CSS 樣式,按鈕將只顯示自訂圖像,沒有任何周圍邊框。

以上是如何去除帶有自訂圖像的按鈕的灰色邊框?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn