Định nghĩa và sử dụng
- Tag <video> xác định một video, chẳng hạn như một đoạn phim hoặc một trường video.
- Đoạn text nằm bên trong <video> và </video> sẽ hiển thị khi trình duyệt không hỗ trợ tag <video>
- Thường dùng kèm với tag <source> để hiện thị được nhiều nội dung hơn.
Sự khác nhau giữa HTML4.01 và HTML5
HTML4.01 | HTML5 |
---|---|
● Không hỗ trợ | ● Đây là tag mới trong HTML5 |
Cấu trúc
<video src="" controls="controls">Dòng thông báo</video>
Ví dụ
Html viết:
<video src="đường dẫn tới file video" controls="controls">Trình duyệt bạn đang dùng không hỗ trợ tag video.</video>
Hiển thị nhiều nội dung với tag <source>
<video controls="controls">
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
</video>
Do trình duyệt hỗ trợ các định dạng file video khác nhau, nên cách dùng trên có thể chạy video cho nhiều trình duyệt và hệ điều hành khác nhau.
Định dạng file video hỗ trợ bởi trình duyệt và hệ điều hành:
WebM | X | 4 | 10.6 | 6 | X | X | X | X |
---|---|---|---|---|---|---|---|---|
Ogg | X | 3.6 | 10.5 | 6 | X | X | X | X |
MPEG-4 | 9 | X | X | X | 5.1 | 3.1 | X | X |
- Chuyển đổi định dạng file video: http://easyhtml5video.com/
Trình duyệt hỗ trợ
Yêu cầu phiên bản trình duyệt với mức tối thiểu được hỗ trợ cho thẻ <video>:
Trình duyệt dành cho PC:
- 9
- 3.6
- 10.5
- 6
- 5
Tag <video> được hỗ trợ trong đa số các trình duyệt.
Thiết bị hỗ trợ
Yêu cầu phiên bản hệ điều hành và trình duyệt với mức tối thiểu được hỗ trợ cho thẻ <video>:
ĐIỆN THOẠI (SMARTPHONE)
Hệ điều hành
- 3.1
- 2.1
- 7.5
- 6
- 5.3
- 1.4
Trình duyệt
- 8
- 11
MÁY TÍNH BẢNG (TABLETS)
Hệ điều hành
- 3.2
- 3.2
- 10
- 3.0
- 1.0
Trình duyệt
- 10
- 11
Thuộc tính
Cách sử dụng: <video thuoctinh="giatri"></video>
Thuộc tính tùy chọn
Thuộc tính | Giá trị | Ví dụ | Mô tả |
---|---|---|---|
audio | muted | audio="muted" | Xác định trạng thái mặc định của âm thanh. |
autoplay | autoplay | autoplay="autoplay" | Xác định trạng thái tự động chạy của video. |
controls | controls | controls="controls" | Hiển thị bộ điều khiển của video. |
height | pixel | height="100px" | Xác định chiều cao của video. |
loop | loop | loop="loop" | Xác định video có được lặp lại hay không. |
poster | URL | poster="image/img_video.gif" | Xác định hình đại diện cho video. |
preload | preload | preload="preload" | Xác định việc tải video khi tải trang. |
src | URL | src="video/video.mpeg" | Xác định đường dẫn của video. |
width | pixel | width="100px" | Xác định chiều rộng của video. |
Thuộc tính Tổng quát và thuộc tính sự kiện
Tất cả thuộc tính tổng quát và thuộc tính sự kiện được xác định trên phần lớn các thành phần HTML5