CSS是我們網頁設計中必不可少的一個技術，特別是在按鈕設計上，CSS可以實現很多炫酷的效果。今天我們來講一下如何用CSS使按鈕獲得透明背景的圖片。

.button {
background: url("button-bg.png");/* 背景圖片地址 */
border: none;
color: #fff;
padding: 10px 15px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
cursor: pointer;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.button:hover {
opacity: 0.7;/* 透明度 */
}

首先，我們先定義一個帶有默認背景圖片的按鈕樣式，例如上面的.button類樣式。在這個樣式中，我們設置了背景圖片的地址，并且去掉了邊框、設置了文本顏色為白色、居中對齊等等。

接下來，在:hover偽類中我們可以使用opacity屬性來定義按鈕被懸浮時的透明度。例如在上述代碼中，當按鈕被懸浮時，它的透明度將變為0.7，從而使背景圖片透過來，看起來像是半透明的背景。

使用CSS實現透明背景圖片的按鈕是一種簡單而有效的方式，可以讓你的按鈕看起來更加專業和具有吸引力。在你的下一個網頁設計項目中試試看吧！