語音播放動圖CSS是一種應用于網頁設計的技術，可以實現點擊播放語音，并且配合動圖來增強頁面的視覺效果。

/* 點擊語音按鈕時綁定音頻文件 */
var audio = new Audio('audio.mp3');
/* 播放按鈕樣式 */
.play-button {
width: 50px;
height: 50px;
background-image: url(play.png);
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
}
/* 觸發語音播放的事件 */
.play-button:hover,
.play-button:focus {
background-image: url(pause.png);
animation: playing-pulse .5s alternate infinite;
outline: none;
}
/* 動圖樣式 */
@keyframes playing-pulse {
from {
transform: scale(1);
opacity: 1;
}
to {
transform: scale(1.5);
opacity: .5;
}
}

在上述代碼中，我們先根據audio標簽綁定音頻文件。接下來，我們定義了播放按鈕的樣式，包括按鈕的大小、背景圖片、重復等。接著，我們定義了播放按鈕事件的觸發方式，鼠標移動以上或者聚焦在按鈕上時，播放按鈕動態切換為暫停按鈕，同時播放動圖動態放大縮小，視覺效果生動。

最后，我們通過 CSS 的 @keyframes 聲明了 playing-pulse 動畫，當播放按鈕通過:hover 和:focus 開始觸發動畫。