Thẻ audio trong HTML

Để lồng file âm thanh vào văn bản HTML bạn sử dụng thẻ <audio>. Mẫu code của nó như sau:

[code language=”html”]
<audio preload="none" controls="controls">
<source src="https://kiencang.net/file/audio.mp3" type="audio/mpeg" />
Trình duyệt của bạn không hỗ trợ thẻ audio
</audio>
[/code]

Kết quả bên dưới (Leslie’s Strut (Sting) – Free music Youtube):

Định nghĩa và cách sử dụng

Hiện tại có 3 định dạng được hỗ trợ bởi thẻ audio, đó là MP3, Wav, và Ogg. Tuy nhiên các trình duyệt hỗ trợ không giống nhau:

Trình duyệt MP3 Wav Ogg
Interner Expoler  Có  Không  Không
Chrome  Có
Firefox
Safari Không
Opera

Kiểu MIME cho định dạng Audio

Định dạng MIME type
MP3 audio/mpeg
Ogg audio/ogg
Wav audio/wav

Trình duyệt hỗ trợ

Cả 5 trình duyệt lớn hiện tại đều hộ trợ thẻ <audio>. Các con số trong bảng chỉ phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ tính năng của thẻ.

Trình duyệt Chrome Firefox IE Safari Opera
<audio> 4.0 3.5 9.0 4.0  10.5

Các thuộc tính

Thuộc tính Giá trị Mô tả
autoplay autoplay Chỉ định âm thanh được bật ngay khi sẵn sàng (chỉ cần load xong là sẽ tự động bật)
controls controls Chỉ định là nút điều khiển sẽ hiển thị ra ngoài (thí dụ như nút tắt bật âm thanh)
loop loop Chỉ định là âm thanh sẽ được bật lại lần nữa sau khi hoàn thành xong
muted muted Chỉ định âm thanh đầu ra không có cường độ (tắt tiếng)
preload auto
metadata
none
Chỉ định cách thức tải trước của âm thanh khi trang web được tải. Điều này ảnh hưởng đến thời gian tải trang. Nên sẽ ảnh hưởng đến trải nghiệm người dùng.
src URL  Đường dẫn chứa file audio

2 thoughts on “Thẻ audio trong HTML”

  1. Chào bạn! Bạn có thể cho mình xin cái code nhạc đầy đủ thuộc tính như: tự play, lặp lại một lần, lặp lại mãi được không bạn? Cảm ơn bạn rất nhiều.

    Reply

Leave a Comment