Cách chèn âm thanh Audio vào trang web bằng HTML5

Bài trước Dũ cũng hướng dẫn các bạn Cách chèn Video vào trang web bằng HTML5 ở bài này Dũ xin hướng dẫn các bạn cách chèn âm thanh thẻ Audio vào trang web bằng HTML5.

Đầu tiên chúng ta cần tiềm hiểu về trình duyệt hỗ trợ chạy thẻ Audio trong HTML5.
- Internet Explorer 9, Opera, Chrome, Frirefox và Safari Hỗ trợ chơi được thể <audio>
- đối với trình duyệt Internet Explorer 8 cùng các phiên bản trước đó đều không hỗ trợ thẻ <audio>
Lưu ý: tuy một số trình duyệt này hỗ trợ chạy được thẻ Audio nhưng có một số loại định dạng nó sẻ không chạy được như
- Internet Explorer không chơi được định dạng Wav và Ogg.
- Opera không chơi được file .mp3
- Safari không chơi được định dạng .Ogg
Các kiểu MINE-TYPE cho các định dạng Audio
- Mp3 -> audio/mpeg
- Wav -> audio/wav
- Ogg -> audio/ogg

Cú pháp của thẻ audio là:

<audio src="file.mp3" autoplay controls></audio>

src: đường dẫn đến tập tin âm thanh (mp3, wav,ogg)
autoplay: cho phép tự động chơi khi âm thanh đã sãng sàng.
controls: cho phép hiện ra thanh điều khiển của audio đó.
loop: lập lại âm thanh khi nó phát hết.

cú pháp thứ 2 của thẻ audio

<audio controls>
    <source src="file.mp3" type="audio/mpeg">
    <source src="file.wav" type="audio/wav">
</audio>

Lời kết : Kết thúc bài hôm nay Minh Dũ nghĩ các bạn cũng đã nắm được Cách chèn âm thanh Audio vào trang web bằng HTML5. Chúc các bạn thành công!

Tác giả : Phuong Thảo

Chia Sẻ

Bài viết liên quan