CSS按鈕加入圖片是設計網頁時一個很常見的需求。如今，我們不僅可以使用純CSS方法實現按鈕樣式的設計，還可以在CSS按鈕內部加入圖片來豐富按鈕的視覺效果。

.btn {
background-color: #52c41a;  /* 設置按鈕背景顏色 */
color: #fff; /* 設置字體顏色 */
border: none; /* 去掉邊框 */
padding: 8px 16px; /*設置內邊距*/
border-radius: 4px; /* 圓角 */
font-size: 14px; /* 設置字體大小 */
display: inline-block; /* 塊級元素 */
cursor: pointer; /* 設置鼠標懸停形狀 */
text-align: center; /* 按鈕文本居中 */
position: relative; /* 相對定位 */
}
.btn img {
position: absolute; /* 設置圖片絕對定位 */
top: 50%; /* 讓圖片位置居中 */
left: 50%;
transform: translate(-50%, -50%); /* 設置圖片偏移位置 */
}

代碼中的.btn表示要設置的按鈕類名，我們先設置好按鈕的基本樣式，然后在.btn后添加img這個標簽，就可以將圖片加入按鈕中了。在img標簽中設置position:absolute,并通過top、left以及transform屬性來讓圖片居中，并且不影響按鈕的其他樣式。

在HTML中使用代碼如下：

<button class="btn">
<img src="image/button-icon.png">
按鈕
</button>

在按鈕中加入圖片后，不僅讓按鈕變得更加豐富多彩，還能增加用戶體驗的互動和趣味性。如果您正在設計網頁，那么不妨試試在CSS按鈕里面加上圖片來優化您的頁面吧！