Video HTML
Phần tử HTML <video>
được sử dụng để hiển thị video trên trang web.
Phần tử HTML <video>
Để hiển thị video bằng HTML, hãy 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">
Your browser does not support the video tag.
</video>
Hãy tự mình thử »Làm thế nào nó 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.
Bạn nên luôn bao gồm các thuộc tính width
và height
. Nếu chiều cao và chiều rộng không được đặt, trang có thể nhấp nháy trong khi tải video.
Phần tử <source>
cho phép bạn chỉ định các tệp video thay thế mà trình duyệt có thể chọn. Trình duyệt sẽ sử dụng định dạng được nhận dạng đầu tiên.
Văn bản giữa thẻ <video>
và </video>
sẽ chỉ được hiển thị trong các trình duyệt không hỗ trợ phần tử <video>
.
HTML <video> Tự động phát
Để bắt đầu video tự động, hãy 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">
Your browser does not support the video tag.
</video>
Hãy tự mình thử »Lưu ý: Trình duyệt Chrome không cho phép tự động phát trong hầu hết các trường hợp. Tuy nhiên, tính năng tự động phát bị tắt tiếng luôn được cho phép.
Thêm muted
sau khi autoplay
để video của bạn bắt đầu phát tự động (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">
Your browser does not support the video tag.
</video>
Hãy tự mình thử »Hỗ trợ trình duyệt
Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ phần tử <video>
.
Element | |||||
---|---|---|---|---|---|
<video> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
Định dạng video HTML
Có ba định dạng video được hỗ trợ: MP4, WebM và Ogg. Hỗ trợ trình duyệt cho các định dạng khác nhau là:
Browser | MP4 | WebM | Ogg |
---|---|---|---|
Edge | YES | YES | YES |
Chrome | YES | YES | YES |
Firefox | YES | YES | YES |
Safari | YES | YES | NO |
Opera | YES | YES | YES |
Video HTML - Loại phương tiện
File Format | Media Type |
---|---|
MP4 | video/mp4 |
WebM | video/webm |
Ogg | video/ogg |
Video HTML - Phương thức, thuộc tính và sự kiện
HTML DOM xác định 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ư cài đặt thời lượng và âm lượng.
Ngoài ra còn có các sự kiện DOM có thể thông báo cho bạn khi video bắt đầu phát, bị tạm dừng, v.v.
Để có tài liệu tham khảo DOM đầy đủ, hãy truy cập Tài liệu tham khảo DOM âm thanh/video HTML của chúng tôi.
Thẻ video HTML
Tag | Description |
---|---|
<video> | Defines a video or movie |
<source> | Defines multiple media resources for media elements, such as <video> and <audio> |
<track> | Defines text tracks in media players |