Cách chèn phim hoặc video vào tài liệu HTML

Bạn có thể nhúng phim vào tài liệu HTML bằng các ví dụ bên dưới. Để tương thích, chúng tôi khuyên bạn nên sử dụng định dạng video MP4, được hỗ trợ bởi tất cả các trình duyệt và hệ điều hành chính.

Mẹo: Lưu trữ phim trên máy chủ của bạn có thể tốn kém vì chi phí băng thông. Nếu bạn không muốn lo lắng về việc lưu trữ các tệp video và muốn thu hút sự chú ý của một lượng lớn khán giả, lưu trữ video trên YouTube và nhúng liên kết trên trang web của bạn là một ý tưởng tuyệt vời.

Lưu ý: Không phải tất cả các đề xuất dưới đây sẽ hoạt động cho tất cả các trình duyệt. Đảm bảo giải pháp bạn quyết định sử dụng hoạt động với các trình duyệt bạn muốn hỗ trợ.

Các ví dụ dưới đây cung cấp các phương pháp khác nhau để làm cho tệp video có thể xem được từ cửa sổ trình duyệt. Chúng tôi cũng khuyên bạn nên tạo liên kết tải xuống trực tiếp vào tệp, cho phép khách truy cập tải xuống tệp nếu phim không phát trong trình duyệt. Dưới đây là hai ví dụ về liên kết trực tiếp cho hai tệp video trong tài liệu này.

Robot ổ đĩa mềm

Mã HTML

 Robot ổ đĩa mềm 

IBM Linux thương mại

Mã HTML

 IBM Linux thương mại 

Nhúng video YouTube

Lưu trữ video trên YouTube rất tuyệt vời vì nó tiết kiệm chi phí băng thông, có thể hỗ trợ nhiều người xem và cũng có thể giới thiệu video của bạn với khách truy cập trang phổ biến nhất trên Internet. Dưới đây là một ví dụ về một video được lưu trữ trên YouTube và được nhúng trên trang web này.

Mã HTML

Mã HTML cho tất cả các video YouTube được tìm thấy thông qua liên kết chia sẻ được tìm thấy trên mỗi video YouTube. Khi bạn đã nhấp vào liên kết Chia sẻ, nhấp vào liên kết Nhúng . Dưới đây là một ví dụ về mã được sử dụng để hiển thị video YouTube ở trên.

Thẻ video

Thẻ này là thẻ HTML được thiết kế để hiển thị video trong tất cả các trình duyệt hiện đại. Thẻ hỗ trợ các định dạng video MP4, Ogg và WebM và có thể được triển khai chỉ với một thẻ HTML.

Mã HTML

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

Thẻ nhúng cơ bản

Dưới đây là mã cho phương pháp cơ bản nhất để nhúng tệp vào trang web.

Mã HTML ví dụ

Trong ví dụ này, bạn đang sử dụng phần tử nhúng để trỏ đến nguồn của tệp phim bạn muốn phát. Hãy nhớ rằng, đây là một ví dụ rất cơ bản và sẽ không hiển thị bất kỳ cảnh báo nào hoặc hướng người dùng đến một vị trí để tải xuống trình cắm nếu tệp video không được hỗ trợ.

Thêm tệp phim bằng thẻ img

Nếu bạn không muốn sử dụng thẻ, bạn cũng có thể bao gồm tệp phim bằng cách sử dụng thẻ, như trong ví dụ dưới đây.

Mã HTML ví dụ

Thẻ nhúng để phát phim QuickTime (.MOV)

Các tập tin phim Apple QuickTime là một loại phim phổ biến khác trên Internet. Dưới đây là một ví dụ cơ bản về cách đưa các tệp này vào trang web của bạn.

Lưu ý: QuickTime không còn được hỗ trợ trên Microsoft Windows và tất cả các trình duyệt mới không còn hỗ trợ phương pháp nhúng phim này.

Mã HTML ví dụ

Trong ví dụ nhúng ở trên, phần đầu tiên của mã trỏ đến src (nguồn) của tệp phim, chính là tệp phim. Tiếp theo, plugin là vị trí của trình cắm nếu khách truy cập chưa cài đặt. Chiều rộngchiều cao là kích thước thực tế của tệp video. Giá trị Bộ điều khiển có thể được đặt thành đúng hoặc sai để chuyển đổi hiển thị các điều khiển dưới cùng.

Mẹo: Bạn có thể muốn tăng chiều cao của tệp video nếu bạn không thể thấy bộ điều khiển.

Vòng lặp là cài đặt khi bạn muốn tệp tự động bắt đầu lại khi kết thúc. Cuối cùng, tự động phát báo cho trình duyệt bắt đầu hoặc không bắt đầu phát tệp video sau khi trang tải xong.

Nhập thuộc tính cho thẻ nhúng để chỉ định trình cắm

Trong thẻ nhúng, bao gồm thuộc tính loại để chỉ định loại MIME cho tệp video. Làm như vậy cho phép bạn chỉ định trình cắm cần thiết để phát video trong trình duyệt.

Mã HTML ví dụ

Trong ví dụ trên, thuộc tính type được đặt thành video / x-msvideo, đây là loại MIME cho các tệp video AVI.

Để xác định giá trị để gán cho thuộc tính loại cho các loại tệp video khác, hãy kiểm tra danh sách các loại MIME cho các tệp video trên trang IANA Media Type.