Video trong HTML

Thẻ video sẽ định nghĩa một video, nói cách khác nó sẽ nhúng một video vào trình duyệt

Bài viết này đã được đăng tại freetuts. mạng, không được sao chép dưới mọi hình thức

Hiện tại, có 3 loại tệp video được hỗ trợ đó là. MP4, WebM và Ogg

Hỗ trợ các trình duyệt

• MP4. Chrome, Firefox, Opera, Safari, IE
• WebM. Chrome, firefox, opera
• Ogg. Chrome, firefox, opera

Cách sử dụng

Ví dụ. sử dụng thẻ video để chèn video vào trang

Bài viết này đã được đăng tại [free tuts. bọc lưới]

Chuẩn bị tệp video. mp4 nằm cùng cấp với tệp HTML

    
        
    

    
        Học html miễn phí tại freetvarts.net
        
        
    

Bài 39. Video trong HTML5

Nội dung

• Ví dụ về video HTML. Nguồn video Big Buck Bunny
• Chạy video trong HTML
• Support browser
• Phần tử trong HTML
  • Ví dụ
• Cách hoạt động?
• Phát video tự động trong HTML
  • Ví dụ
• Video HTML – Hỗ trợ duyệt trình
• Video HTML – Các loại phương tiện
• HTML Video – Các phương thức, thuộc tính và sự kiện
  • Ví dụ. Sử dụng JavaScript
• Gắn thẻ Video trong HTML5

Ví dụ về video HTML. Nguồn video Big Buck Bunny

Trình duyệt của bạn không hỗ trợ thẻ video của HTML5

Chạy video trong HTML

Trước HTML5, video chỉ có thể chạy được trong trình duyệt có cài đặt plug-in để xem video [ví dụ như flash]

Phần tử trong HTML5 định nghĩa một chuẩn để nhúng video vào một trang web.

Support browser

Những con số trong bảng xác định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ phần tử .

Trình nhuộm4.09.03.54.010.5

Phần tử trong HTML

Để hiển thị một video  HTML, sử dụng phần tử :

Ví dụ

Trình duyệt của bạn không hỗ trợ thẻ video.

View results

Trình duyệt của bạn không hỗ trợ thẻ video

Cách hoạt động?

Thuộc tính kiểm soát các điều khiển cho video như chạy, dừng và âm lượng

Một ý tưởng tốt là luôn sử dụng thuộc tính chiều rộng [chiều rộng] và chiều cao [chiều cao]. Nếu chiều cao và chiều rộng không được thiết lập, trang web có thể rung hình khi tải video

Phần tử  cho phép bạn định nghĩa các các tập tin video thay thế mà trình duyệt có thể chọn từ đó.  Trình duyệt sẽ sử dụng các định dạng đầu tiên mà nó nhận biết được.

Đoạn văn bản nằm giữa thẻ và sẽ chỉ hiển thị trong trình duyệt mà trình duyệt không hỗ trợ phần tử .

Phát video tự động trong HTML

Để một video chạy tự động ta sử dụng thuộc tính tự động phát

Ví dụ

Trình duyệt của bạn không hỗ trợ thẻ video.

View results

Quá trình duyệt của bạn không hỗ trợ thẻ video.
Thuộc tính tự động phát không hoạt động trong các thiết bị di động như iPad và iPhone.

Video HTML – Hỗ trợ duyệt trình

Trong HTML5, Có 3 loại video được hỗ trợ với định dạng. MP4, WebM và Ogg

Các trình duyệt hỗ trợ các định dạng khác nhau

Trình duyệtMP4WebMOggInternet ExplorerCóKhôngKhôngChromeCóCóCóFirefoxCóCóSafariCóKhôngKhôngOperaCó [từ Opera 25]CóCó

Video HTML – Các loại phương tiện

Định dạng FileKiểu MediaMP4video/mp4WebMvideo/webmOggvideo/ogg

HTML Video – Các phương thức, thuộc tính và sự kiện

HTML5 định nghĩa DOM [Mô hình đối tượng dữ liệu] với các phương thức, thuộc tính và sự kiện cho phần tử