如何使用原生html播放音樂(基礎篇)
以下有幾種方式可以嵌入音樂在網頁中(已測試可在Chrome, Firefox, Safari下正常執行)
使用embed 或 object
<embed height="50px" width="100px" src="song.mp3" />
<object height="50px" width="100px" data="song.mp3" ></object>
注意事項:
- embed tag結尾需有 '/',或是用包起來,如: </embed>
- object的部份最好以作結尾,部分瀏覽器並不接受
- 若無給定height與width會有一預設大小
- 若依舊無法正常播放,請檢查瀏覽器是否為最新版本,或查找該版本瀏覽器是否支援此html標籤與該檔案格式
- 相關屬性設定可參閱此文章
使用HTML5
```- 為確保瀏覽器可認得此html5的audio標籤,需在網頁最上方加入
- ogg是並免某些瀏覽器(部分版本的Firefox, Chrome, Opera)不支援mp3檔案格式的播放。(若發現第一個音檔不能執行便會往下一個音檔執行,依此類推)
- 線上mp3轉ogg的converter
綜合解
```註:此綜合解包含了多種播放方式:html5的audio標籤會先去嘗試播放mp3或ogg檔案,若都失敗則會嘗試用html4的embed標籤播放,若都失敗則輸出錯誤。
範例網頁