CSS 音樂播放圖片旋轉可以通過使用 transform 屬性來實現。以下是一個實現的例子:
.music-icon { width: 50px; height: 50px; background-image: url('music-icon.png'); background-size: cover; animation: rotate 2s linear infinite; } @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
以上代碼中,.music-icon 是包含音樂播放圖標的元素的類名。設置其寬度和高度,以及背景圖像。這個類的關鍵在于定義了一個動畫來實現旋轉。通過定義 rotate 角度從 0 到 360 度,從而實現無限旋轉。可以根據需要更改動畫的持續時間。
使用這種方法可以輕松地向網站或應用程序添加一個漂亮的音樂播放標志,增強用戶體驗。