今天我們來介紹<audio>標籤~

<audio>標籤

<audio>：嵌入音頻文件
用於在網頁中嵌入音頻文件。這個標籤支持多種音頻格式（如 MP3、WAV、OGG），並提供顯示播放控制器、是否自動播放等屬性。

常用屬性：

• src：指定音頻文件的路徑或 URL。

  <audio src="路徑"></audio>
  

• controls：顯示音頻播放控制器
  告訴瀏覽器在音頻元素上顯示撥放控制，讓用戶能夠播放、暫停或調整音量

  <audio src="music.mp3" controls></audio>
  

  

• autoplay：自動撥放音頻
  使音頻在網頁加載時自動播放

• loop：循環播放
  當音頻播放結束後會自動重新開始，進行循環播放。

• muted：靜音播放音頻
  讓音頻在一開始撥放時處於靜音狀態，使用者可以手動取消靜音
  範例：

  <audio src="music.mp3" muted controls></audio>
  

  

<audio>搭配<source>子標籤

<source> 屬性 :

• src：指定音頻文件的路徑或 URL。

• type：指定音頻文件的 MIME 類型，例如 audio/mp3 或 audio/ogg。
  當 <audio> 標籤包含多個 <source> 標籤時，瀏覽器會依次嘗試播放每個文件，直到找到一個可以播放的格式。

  <audio controls>
    <source src="music.mp3" type="audio/mp3">
    <source src="music.ogg" type="audio/ogg">
    您的瀏覽器不支持 audio 元素。
  </audio>
  

  • <source src="music.mp3" type="audio/mp3">：這一行提供了 MP3 格式的音頻文件。許多瀏覽器都支持 MP3，因此這是常用的音頻格式之一。
  • <source src="music.ogg" type="audio/ogg">：這一行提供了 OGG 格式的音頻文件。這是一個開源格式，某些瀏覽器，如 Firefox 和 Chrome，支持此格式。
  • 瀏覽器兼容性：瀏覽器會根據其支持的格式選擇播放合適的音頻文件。若瀏覽器無法播放任何格式，會顯示備選文本“您的瀏覽器不支持 audio 元素”。

今天先介紹到這裡，謝謝觀看！