Chèn video cùng ảnh đại diện
```html
<video width="320" height="180" controls poster="anh/sach.png">
<source src="phim/chuyen_dong.mp4" type="video/mp4">
<source src="phim/chuyen_dong.webm" type="video/webm">
Trình duyệt không hỗ trợ phần tử video.
</video>
```
width và height đặt vùng video 320 × 180 pixel; controls hiện bộ điều khiển. poster chỉ ảnh hiển thị trước khi video chạy hoặc chưa có khung hình để hiển thị. poster không phải chính video.
Mẫu là chấm tròn chuyển động hai giây, không có âm thanh. MP4 và WebM là hai dạng tệp video thường gặp. Khả năng phát còn tùy cách mã hóa bên trong và trình duyệt; phần mở rộng không đủ để bảo đảm phát được.
source là các lựa chọn cho cùng nội dung
Ví dụ có hai source: MP4 trước, WebM sau. Trình duyệt chọn một nguồn thích hợp theo thứ tự, không phát nối tiếp cả hai như danh sách phát. type cho biết loại dữ liệu của từng nguồn, giúp trình duyệt lựa chọn.
Không đặt src trực tiếp trên video khi muốn dùng danh sách source này. Nếu video có src, tệp ấy là nguồn trực tiếp thay vì danh sách source bên trong.
Dòng chữ giữa cặp thẻ video là nội dung dành cho trình duyệt không hỗ trợ phần tử video. Không coi đó là thông báo chắc chắn xuất hiện trong mọi lỗi tệp hoặc lỗi đường dẫn.
Kiểm chuyển động và điều kiện phát
Mở trang mẫu, chọn phát video. Chấm tròn phải đổi vị trí, thời gian tiến và có thể tạm dừng. Video không có tiếng theo dữ liệu mẫu, nên không dùng việc im lặng để kết luận lỗi.
Nếu ảnh poster hiện nhưng video không chạy, kiểm nguồn video, định dạng/mã hóa, kết nối và thao tác phát. Poster tải được chỉ chứng minh ảnh ấy tải được.
Video cũng có autoplay và muted. Tự phát video tắt tiếng thường được cho phép hơn video có tiếng, nhưng vẫn cần kiểm trên trình duyệt thực tế.
Bài luyện
Trong ví dụ, poster="anh/sach.png" dùng để làm gì?
poster chỉ tới ảnh.
Đúng. poster là ảnh, không phải nguồn video.
poster không nén video.
poster không tạo phụ đề.
Lời giải
poster chứa đường dẫn ảnh hiển thị khi video chưa chạy hoặc chưa có hình. Các source mới chỉ tệp video; đổi poster không đổi dữ liệu chuyển động.
Bài luyện
Hai source MP4 và WebM trong cùng video có ý nghĩa nào?
Hai source không tạo hai cửa sổ riêng.
Đây không phải danh sách phát nối tiếp.
Đúng. Trình duyệt chọn một nguồn có thể dùng.
source ở đây là tệp video, không phải poster.
Lời giải
Các source cung cấp những định dạng thay thế cho một phần tử video. Trình duyệt xem xét theo thứ tự để chọn nguồn thích hợp, không mặc định ghép hai tệp thành phim dài hơn.
Bài luyện
Ảnh poster hiện rõ nhưng video không chạy. Điều gì đã được chứng minh?
Đúng. Ảnh và video là tài nguyên riêng.
Ảnh tải được không kiểm được tệp video.
Ảnh poster không chứng minh thời gian phát đã chạy.
Hiển thị poster không chứng minh img bị cấm.
Lời giải
poster và nguồn video có đường dẫn, dữ liệu riêng. Poster hiện chỉ cho thấy ảnh đó được hiển thị; cần thử phát và kiểm tệp, định dạng/mã hóa hoặc kết nối của video.
Đang học