Phần tử HTML <video> được sử dụng để hiển thị một video trên một trang web.
Phần tử HTML <video>
Để hiển thị video trong HTML, bạn sử dụng phần tử <video>:
Ví dụ
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Trình duyệt của bạn không hỗ trợ thẻ video.
</video>
Cách hoạt động
Thuộc tính controls thêm các điều khiển video, như phát, tạm dừng và âm lượng.
Luôn luôn nên bao gồm các thuộc tính width và height. Nếu không thiết lập chiều cao và rộng, trang có thể nhấp nháy trong khi video đang tải.
Phần tử <source> cho phép bạn xác định các tệp video thay thế mà trình duyệt có thể lựa chọn. Trình duyệt sẽ sử dụng định dạng đầu tiên được nhận dạng.
Văn bản giữa các thẻ <video> và </video> sẽ chỉ được hiển thị trong trình duyệt không hỗ trợ phần tử <video>.
Phát video HTML tự động
Để bắt đầu một video tự động, sử dụng thuộc tính autoplay:
Ví dụ
<video width="320" height="240" autoplay>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Trình duyệt của bạn không hỗ trợ thẻ video.
Lưu ý: Trình duyệt Chromium không cho phép phát video tự động trong hầu hết các trường hợp. Tuy nhiên, phát video đã tắt âm thanh luôn được phép. |
Thêm muted sau autoplay để cho phép video của bạn bắt đầu tự động phát (nhưng bị tắt tiếng):
Ví dụ
<video width="320" height="240" autoplay muted>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Trình duyệt của bạn không hỗ trợ thẻ video.
</video>
Hỗ trợ của Trình duyệt
Các số trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ phần tử <video>.
Phần tử | Internet Explorer | Firefox | Chrome | Safari | Opera |
<video> | 9.0 | 3.5 | 4.0 | 3.0 | 10.5 |
Các Định dạng Video HTML
Có ba định dạng video được hỗ trợ: MP4, WebM và Ogg. Sự hỗ trợ của trình duyệt cho các định dạng khác nhau là:
Trình duyệt | MP4 | WebM | Ogg |
Edge | Có | Có | Có |
Chrome | Có | Có | Có |
Firefox | Có | Có | Có |
Safari | Có | Có | Không |
Opera | Có | Có | Có |
Các Định dạng Phương tiện Video HTML
MP4 | video/mp4 |
WebM | video/webm |
Ogg | video/ogg |
Phương thức, Thuộc tính và Sự kiện Video HTML
DOM HTML định nghĩa các phương thức, thuộc tính và sự kiện cho phần tử <video>.
Điều này cho phép bạn tải, phát và tạm dừng video, cũng như thiết lập thời lượng và âm lượng.
Cũng có sự kiện DOM có thể thông báo khi video bắt đầu phát, bị tạm dừng, v.v.
Các thẻ Video HTML
Thẻ | Mô tả |
<video> | Định nghĩa một video hoặc phim. |
<source> | Định nghĩa nhiều tài nguyên phương tiện cho các phần tử phương tiện, chẳng hạn như <video> và <audio>. |
<track> | Định nghĩa các vết văn bản trong trình phát phương tiện. |