現如今，網站越來越注重交互性，背景音樂也逐漸成為了網站中不可或缺的一部分。而CSS代碼在這方面的運用，也讓音樂播放器成為了一個輕松實現的功能。

/* CSS代碼 */
#music-player {
position: relative;
display: inline-block;
height: 30px;
width: 200px;
text-align: center;
font-size: 14px;
background-color: #f0f0f0;
border-radius: 15px;
}
/* 播放，暫停按鈕 */
#music-player .play,
#music-player .pause {
position: absolute;
top: 3px;
width: 24px;
height: 24px;
cursor: pointer;
}
/* 播放按鈕 */
#music-player .play:before {
content: "";
position: absolute;
top: 0;
left: 7px;
border-left: 12px solid #333;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
}
/* 暫停按鈕 */
#music-player .pause:before {
content: "";
position: absolute;
top: 0;
left: 7px;
width: 8px;
height: 16px;
background-color: #333;
}
/* 音樂播放器的文字 */
#music-player .title {
margin-top: 4px;
}
/* 音樂播放器的背景圖 */
#music-player[data-status="play"] {
background-image: url("pause.png");
background-repeat: no-repeat;
background-position: center;
}
/* HTML代碼 */
<div id="music-player" data-status="pause">
<div class="play"></div>
<div class="pause"></div>
<div class="title">網站背景音樂</div>
</div>

以上就是一個簡單的CSS代碼與HTML代碼，實現了一個簡單的背景音樂播放器。通過CSS的選擇器與樣式，我們可以很輕松地設計出自己想要的樣式，讓音樂播放器更好地融入到網站當中。而在JavaScript的幫助下，我們還可以加入更多的功能，比如音樂的播放，暫停，調節音量等功能，讓背景音樂更好地服務于整個網站的交互。