CSS Audio指令是一種非常有用的CSS技術，它可以幫助我們在網頁中添加音頻，并對其進行樣式化和控制。

.audio {
display: inline-block;
margin: 20px;
background-color: #eee;
padding: 20px;
border-radius: 5px;
-webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
width: 300px;
}
.audio audio {
display: block;
margin: 0 auto;
width: 50%;
}
.audio audio::-webkit-media-controls-play-button {
background: url(play-button.png);
background-size: 100% 100%;
-webkit-appearance: none;
}
.audio audio::-webkit-media-controls-volume-slider {
background: url(volume-slider.png);
background-size: 100% 100%;
-webkit-appearance: none;
}
.audio audio::-webkit-media-controls-current-time-display {
color: #333;
}
.audio audio::-webkit-media-controls-time-remaining-display {
color: #333;
}
.audio audio::-webkit-media-controls-timeline {
background: url(track.png);
background-size: 100% 100%;
}

上述CSS代碼演示了如何對音頻進行外觀樣式控制。我們使用CSS選擇器對音頻控件進行控制。我們使用WebKit廠商前綴來支持Safari和Chrome瀏覽器。

首先，我們定義了一個.audio類，它包含音頻元素和其樣式。音頻元素設置為塊級元素，并與其父元素居中。我們還為音頻元素定義了一些樣式化屬性，如背景顏色，邊距，邊框半徑和陰影等等。

然后，我們使用audio選擇器控制音頻元素的外觀。在這里，我們設置音頻播放按鈕，音量滑塊，當前時間和剩余時間的外觀。我們使用背景圖片來替換默認的控件樣式。我們還更改了時間顯示的字體顏色。

CSS Audio指令非常強大，使得我們能夠在網頁中添加高質量音頻，以及樣式化和控制它們。我們可以使用這些代碼示例作為起點，在您的網頁上創造獨特的音頻體驗。