BÀI 5: CHÈN HÌNH ẢNH, ÂM THANH, VIDEO VÀ SỬ DỤNG KHUNG 

I - MỤC TIÊU BÀI HỌC

• Chèn được hình ảnh, tệp âm thanh, video vào trang web.
• Nhúng được nội dung trang web khác vào trang web.

II - KIẾN THỨC CẦN GHI NHỚ

1. CHÈN HÌNH ẢNH

- Khi tạo trang web, cần có thêm các nội dung đa phương tiện như hình ảnh, âm thanh, video để việc truyền tải thông tin hiệu quả, trực quan và sinh động hơn. 

- HTML định nghĩa phần tử img để chèn hình ảnh vào trang web.

- Phần tử img có cú pháp khai báo như sau:

Trong đó:

+ Thuộc tính src xác định Tên tệp ảnh được chèn vào trang web. 

Lưu ý: Tên tệp ảnh có thể bao gồm cả đường dẫn đến tệp ảnh. Ảnh được sử dụng trên trình duyệt web thường ở các định dạng JPG, PNG, GIF. 

+ Thuộc tính alt xác định Nội dung thay thế sẽ hiển thị vào vùng của hình ảnh trên trình duyệt web trong trường hợp việc hiển thị hình ảnh gặp lỗi. 

+ Thuộc tính width, height:

• Xác định cụ thể kích thước Chiều rộng và Chiều cao của ảnh.
• Thường được dùng để tăng giảm kích thước của ảnh gốc và tuỳ biến kích thước ảnh khi hiển thị trên trình duyệt web. 
• Mặc định được tính theo đơn vị điểm ảnh pixel. 

Lưu ý: Ảnh sẽ được hiển thị theo kích thước ảnh gốc nếu không khai báo thuộc tính width, height.

2. CHÈN ÂM THANH

- Một số định dạng âm thanh thường sử dụng:

+ MP3 (MPEG Audio Layer 3): Định dạng âm thanh phổ biến với chất lượng tốt và kích thước tệp nhỏ. Tuy nhiên có thể cần sử dụng các trình duyệt tương thích để phát tệp MP3.

+ OGG: Kích thước tệp thường nhỏ hơn so với các định dạng khác.

+ WAV (Waveform Audio File Format): Định dạng âm thanh không nén, cung cấp chất lượng tốt nhưng có kích thước tệp lớn hơn, được hỗ trợ rộng rãi trên nhiều trình duyệt.

+ AAC (Advanced Audio Coding): Định dạng âm thanh chất lượng cao và được sử dụng phổ biến trong các dịch vụ phát trực tuyến.

- HTML định nghĩa phần tử audio để chèn âm thanh vào trang web.

- Phần tử audio có cú pháp khai báo như sau:

Trong đó:

+ Thuộc tính src xác định Tên tệp âm thanh được chèn vào trang web. 

Lưu ý: Tên tệp âm thanh có thể bao gồm đường dẫn đến tệp âm thanh. Định dạng tệp âm thanh thường được sử dụng trên trang web là MP3, OGG. 

+ Thuộc tính controls được khai báo để hiển thị bảng điều khiển tệp âm thanh trên trình duyệt web. Bảng điều khiển cung cấp một số nút lệnh có chức năng: Phát, Tạm dừng, Tắt, Tăng/Giảm âm lượng,…

3. CHÈN VIDEO

- Một số định dạng video thường sử dụng:

+ MP4 (MPEG-4): Định dạng video phổ biến, hỗ trợ chất lượng tốt và kích thước tệp nhỏ. MP4 là định dạng video chuẩn cho hầu hết các trình duyệt.

+ OGG: Thường được sử dụng cho video với chất lượng tốt. Tệp OGG thường nhỏ hơn so với MP4.

- HTML định nghĩa phần tử video để chèn âm thanh vào trang web.

- Phần tử video có cú pháp khai báo như sau:

Trong đó:

+ Thuộc tính src xác định Tên tệp video được chèn vào trang web. 

Lưu ý: Tên tệp video có thể bao gồm đường dẫn đến tệp video. Định dạng tệp video thường được sử dụng trên trang web là MP4, OGG. 

+ Thuộc tính controls được khai báo để hiển thị bảng điều khiển tệp video trên trình duyệt web. Bảng điều khiển cung cấp một số nút lệnh có chức năng: Chạy, Tạm dừng, Tắt, Tăng/Giảm âm lượng, Phóng to/Thu nhỏ màn hình,…

4. SỬ DỤNG KHUNG

- HTML định nghĩa phần tử iframe để nhúng một tệp HTML hoặc tài nguyên web khác vào văn bản HTML.

- Phần tử iframe có cú pháp khai báo như sau:

Trong đó:

+ url là đường dẫn đến tệp HTML hoặc tài nguyên web khác.

+ Thuộc tính width, height:

• Xác định cụ thể kích thước chiều rộng và chiều cao của vùng được nhúng trên trang web. 
• Mặc định được tính theo đơn vị điểm ảnh pixel.