Thẻ <video> trong HTML5

Thẻ <video> trong HTML

  • 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></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.01HTML5
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ụ

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

 Internet ExplorerFirefoxOperaChromeSafariIOSAndroidWindow Phone
WebMX410.66XXXX
OggX3.610.56XXXX
MPEG-49XXX5.13.1XX

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:

39image-228

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

Thẻ <video> trong HTML-69

Trình duyệt

Thẻ <video> trong HTML-70

MÁY TÍNH BẢNG (TABLETS)

Hệ điều hành


Trình duyệt

Thẻ <video> trong HTML-72

Thuộc tính

Cách sử dụng:

<video thuoctinh="giatri"></video>

Thuộc tính tùy chọn

Thuộc tínhGiá trịVí dụMô tả
audiomutedaudio="muted"Xác định trạng thái mặc định của âm thanh.
autoplayautoplayautoplay="autoplay"Xác định trạng thái tự động chạy của video.
controlscontrolscontrols="controls"Hiển thị bộ điều khiển của video.
heightpixelheight="100px"Xác định chiều cao của video.
looplooploop="loop"Xác định video có được lặp lại hay không.
posterURLposter="image/img_video.gif"Xác định hình đại diện cho video.
preloadpreloadpreload="preload"Xác định việc tải video khi tải trang.
srcURLsrc="video/video.mpeg"Xác định đường dẫn của video.
widthpixelwidth="100px"Xác định chiều rộng của video.

Thuộc tính Tổng quátthuộ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

Bình luận