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:

<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>

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ệtMP3WavOgg
Interner Expoler Có Không Không
Chrome Có
Firefox
SafariKhông
Opera

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

Định dạngMIME type
MP3audio/mpeg
Oggaudio/ogg
Wavaudio/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ệtChromeFirefoxIESafariOpera
<audio>4.03.59.04.0 10.5

Các thuộc tính

Thuộc tínhGiá trịMô tả
autoplayautoplayChỉ định âm thanh được bật ngay khi sẵn sàng (chỉ cần load xong là sẽ tự động bật)
controlscontrolsChỉ đị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)
looploopChỉ định là âm thanh sẽ được bật lại lần nữa sau khi hoàn thành xong
mutedmutedChỉ định âm thanh đầu ra không có cường độ (tắt tiếng)
preloadauto
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.
srcURL Đườ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