Video giảng khoa học máy tính 12 chân trời bài F4: Thêm dữ liệu đa phương tiện vào trang web

Tóm lược nội dung

BÀI F4: THÊM DỮ LIỆU ĐA PHƯƠNG TIỆN VÀO TRANG WEB

Chào mừng các em học sinh đã đến với bài học hôm nay!

Thông qua video này, các em sẽ nắm được các kiến thức và kỹ năng như sau:

- Sử dụng được các thẻ HTML để thêm ảnh, video và âm thanh vào trang web.

HOẠT ĐỘNG KHỞI ĐỘNG

Trước khi vào bài học, cô mời các em xem trang web https://www.literature.org/ và https://www.elle.vn/, sau đó nêu câu hỏi Khởi động SGK trang 89 cho các nhóm thảo luận: Theo em, một trang web có nội dung chỉ thuần văn bản sẽ có những hạn chế gì so với trang web có thêm hình ảnh và âm thanh?

HOẠT ĐỘNG KHÁM PHÁ

Nội dung 1: Thêm tệp ảnh vào trang web

HTML sử dụng thẻ nào để thêm tệp ảnh vào trang web? Thẻ <img> có những thuộc tính gì?

Video trình bày nội dung: 

Thẻ <img> với các thuộc tính src, alt, width, height,… được dùng để thêm tệp ảnh vào trang web. Thẻ <img> chỉ có thẻ mở, không có thẻ đóng.

Nội dung 2: Thêm tệp video và âm thanh vào trang web

HTML sử dụng thẻ nào để thêm tệp video và âm thanh vào trang web? Thẻ <video> và <audio> có những thuộc tính gì?

Video trình bày nội dung: 

Thẻ <video> và thẻ <audio> dùng để thêm tệp video và âm thanh vào trang web.

Hai thẻ này có cùng một số thuộc tính như src, autoplay, controls, loop, muted,…

Nội dung 3: Thực hành

Em hãy nêu các bước thêm tệp ảnh vào trang web

Video trình bày nội dung: 

- Bước 1: HS khởi động Visual Studio Code và mở tệp portfolio.html.

- Bước 2: HS bổ sung đoạn mã HTML như hướng dẫn để thêm 4 hình ảnh theo bố cục như Hình 3.

- Bước 3: HS mở trang web trong trình duyệt và kiểm tra kết quả thực hiện.

……..

Nội dung video bài F4: Thêm dữ liệu đa phương tiện vào trang web còn nhiều phần rất hấp dẫn và thú vị. Hãy cùng đăng kí để tham gia học bài và củng cố kiến thức thông qua hoạt động luyện tập và vận dụng trong video.