Liên hệ
Ủng hộ, đăng ký theo dõi kênh

Thẻ audio, video trong HTML5

Sử dụng thẻ audio, video để phát các file âm thanh như mp3, wav và các file video như mp4

Thẻ <audio>

Trước HTML5 không có chuẩn để phát các file âm thanh trong trang web. Với HTML5 sử dụng thẻ <audio> để phát file âm thanh. Có hai cách để sử dụng thẻ <audio>:

Cách 1: sử dụng thuộc tính src để chỉ ra file âm thanh

<audio src="audio.mp3" controls>
   Trình duyệt không hỗ trợ phát âm thanh
</audio>

Cách 2: sử dụng phần tử <source> bên trong <audio>, cách này chỉ ra được nhiều file âm thanh

<audio controls>
   <source src="audio.mp3" type="audio/mpeg">
   <source src="audio.ogg" type="audio/ogg">
   Trình duyệt không hỗ trợ phát âm thanh
</audio>

Nhiều nguồn file âm thanh chỉ ra bằng thẻ source, nếu trình duyệt nhận ra định dạng hỗ trợ file đầu thì sẽ sử dụng file đó nếu không nó sẽ xem xét file tiếp theo. Nếu trình duyệt không hỗ trợ phát file âm thanh, nó sẽ hiện thi dòng text trong thẻ audio như ví dụ trên là dòng :Trình duyệt không hỗ trợ phát âm thanh

Thuộc tính trong thẻ <audio>

controls

Nếu có thuộc tính này, điều khiển âm thanh sẽ được hiện thị (như nút play, stop ...)

autoplay

Nếu có thuộc tính này, file âm thanh sẽ tự động phát khi mở trang.

<audio controls autoplay>

loop

Thuộc tính này cho biết file âm thay sẽ được phát đi phát lại.

<audio controls autoplay loop>

Hiện tại có 3 định dạng file âm thanh hỗ trợ trong HTML5: mp3, wav, ogg

Thẻ <video>

Thẻ <video> để phát các file video, phim. Cách sử dụng <video> khá giống với <audio>

<video controls>
   <source src="video.mp4" type="video/mp4">
   <source src="video.ogg" type="video/ogg">
   Trình duyệt của bạn không hỗ trợ video
</video>

Hiện tại có 3 định dạng file video hỗ trợ trong HTML5: mp4, WebM, ogg

Vui lòng đăng ký ủng hộ kênh