CSS按鈕點擊加載圖片是一種常用的前端技術。通過CSS和JavaScript的結合，我們可以在按鈕被點擊的時候，加載一個新的圖片。這樣可以使網頁的交互更加生動和有趣。

.button {
padding: 10px 20px;
background-color: #FFC107;
color: #ffffff;
border: none;
cursor: pointer;
}
.loading {
background-image: url('loading.gif');
background-repeat: no-repeat;
background-position: center;
}

我們首先需要創建一個按鈕，我們可以在CSS中定義一個類名為"button"的樣式。這個樣式定義了按鈕的一些基本樣式，如內邊距、背景色、字體顏色、邊框等。

接下來，在JavaScript中定義一個函數，在函數中使用DOM操作，將按鈕的class屬性從"button"改為"loading"。這樣，當按鈕被點擊時，就會顯示一個"loading"的圖標。

function loadImg() {
var button = document.querySelector('.button');
button.classList.add('loading');
}

最后，我們可以在HTML中添加一個img標簽，當按鈕被點擊時，用JavaScript動態地修改img的src屬性，從而加載另外一張圖片。

以上就是使用CSS按鈕點擊加載圖片的基本步驟。通過這個技術，可以使網站的交互更加豐富、生動，為用戶提供更加優秀的用戶體驗。