Thực hành chèn tệp đa phương tiện và khung nội tuyến (trang 65). Đây là phần thực hành của bài 11 - Chèn tệp đa phương tiện và khung nội tuyến vào trang web - tin học 12 (KNTT). Thầy Cô và các em học sinh có thể dùng làm tài liệu tham khảo. Chúc Thầy Cô dạy tốt, chúc các em học sinh học giỏi.
Hãy thật sự cố gắng khi còn có thể.
Vì mọi sự cố gắng đều đem lại kết quả tốt đẹp.
Vì mọi sự cố gắng đều đem lại kết quả tốt đẹp.
4. THỰC HÀNH CHÈN TỆP ĐA PHƯƠNG TIỆN VÀ KHUNG NỘI TUYẾN
Nhiệm vụ 1: Chèn tệp ảnh
Yêu cầu: Tạo hai trang the_thao.html và nghe_thuat.html và chèn ảnh minh họa.Hướng dẫn:
- Tạo trang the_thao.html và chèn một ảnh bằng thẻ <img>.Chuẩn bị: Tạo thư mục images trong thư mục chứa các bài tập thực hành, sao chép một ảnh hoạt động thể thao của trường/lớp vào thư mục đó (chẳng hạn tệp thethao.png).
Chèn ảnh đã chuẩn bị vào trang web:
Nhiệm vụ 2: Chèn tệp âm thanh
Yêu cầu: Chèn tệp bài hát “Quốc ca” vào trang web.
Hướng dẫn:
Chuẩn bị tệp bài hát Quốc ca (mp4 nếu là video, mp3 nếu là audio) và thực hiện chèn vào trang web bằng thẻ phù hợp và để ở chế độ autoplay.Lưu ý: Em chỉ nên dùng các tài nguyên được phép sử dụng cho trang web của mình.
Nhiệm vụ 3: Chèn khung nội tuyến
Yêu cầu: Chèn khung nội tuyến vào trang CLB.html, hiển thị nội dung của hai trang the_thao.html hoặc nghe_thuat.html tùy theo lựa chọn (Hình 11.5).
Hướng dẫn:
Sử dụng iframe để chèn nội dung của hai trang đã viết trong Nhiệm vụ 1.Bước 1. Tạo tệp tin index.html có nội dung “Câu lạc bộ ngoại khóa Trường Nguyễn Bỉnh Khiêm” đặt trong cặp thẻ <h2></h2>.
Bước 2. Tạo một phần tử iframe để hiển thị nội dung, phần tử iframe được gắn mã định danh để đặt liên kết.
Code tham khảo cho trang thethao.html ➺ Tải file
- Dòng 18: Chèn ảnh thethao.jpg trong thư mục images vào trang thethao.html
- Dòng 19: Chèn bài hát quoc_ca.mp4 trong thư mục images vào trang thethao.html
Code tham khảo cho trang nghethuat.html ➺ Tải file - Dòng 17: Chèn ảnh nghethuat.jpg trong thư mục images vào trang nghethuat.html
- Dòng 18: Chèn bài hát quoc_ca.mp4 trong thư mục images vào trang nghethuat.html
Code tham khảo cho tệp tin index.html ➺ Tải file - Dòng 9: Liên kết đến trang thethao.html để hiển thị trong khung nội tuyến.
- Dòng 10: Liên kết đến trang nghethuat.html để hiển thị trong khung nội tuyến.
- Dòng 11: Tạo khung nội tuyến để trang thethao.html và trang nghethuat.html hiển thị.
- Dòng 19: Chèn bài hát quoc_ca.mp4 trong thư mục images vào trang thethao.html
Code tham khảo cho trang nghethuat.html ➺ Tải file - Dòng 17: Chèn ảnh nghethuat.jpg trong thư mục images vào trang nghethuat.html
- Dòng 18: Chèn bài hát quoc_ca.mp4 trong thư mục images vào trang nghethuat.html
Code tham khảo cho tệp tin index.html ➺ Tải file - Dòng 9: Liên kết đến trang thethao.html để hiển thị trong khung nội tuyến.
- Dòng 10: Liên kết đến trang nghethuat.html để hiển thị trong khung nội tuyến.
- Dòng 11: Tạo khung nội tuyến để trang thethao.html và trang nghethuat.html hiển thị.
CÙNG CHUYÊN MỤC:
Bài thực hành số 1. Định dạng văn bản và phông chữ (trang 50 của bài 8)
Bài thực hành số 2. Tạo danh sách và bảng (trang 55 của bài 9)
Bài thực hành số 3. Tạo liên kết (trang 61 của bài 10)
Bài thực hành số 4. Chèn tệp đa phương tiện và khung nội tuyến (trang 65 của bài 11)
Bài thực hành số 5. Tạo biểu mẫu (trang 69 của bài 12)
Bài thực hành số 6. Định dạng văn bản bằng CSS (trang 81 của bài 14)
Bài thực hành số 7. Tạo màu cho chữ và nền (trang 88 của bài 15)
Bài thực hành số 8. Định dạng khung (trang 93 của bài 16)
Bài thực hành số 9. Các mức ưu tiên của bộ chọn (trang 100 của bài 17)
Bài thực hành số 10. Thực hành tổng hợp thiết kế trang web (trang 103 của bài 18)
Bài thực hành số 2. Tạo danh sách và bảng (trang 55 của bài 9)
Bài thực hành số 3. Tạo liên kết (trang 61 của bài 10)
Bài thực hành số 4. Chèn tệp đa phương tiện và khung nội tuyến (trang 65 của bài 11)
Bài thực hành số 5. Tạo biểu mẫu (trang 69 của bài 12)
Bài thực hành số 6. Định dạng văn bản bằng CSS (trang 81 của bài 14)
Bài thực hành số 7. Tạo màu cho chữ và nền (trang 88 của bài 15)
Bài thực hành số 8. Định dạng khung (trang 93 của bài 16)
Bài thực hành số 9. Các mức ưu tiên của bộ chọn (trang 100 của bài 17)
Bài thực hành số 10. Thực hành tổng hợp thiết kế trang web (trang 103 của bài 18)
CÁC CHUYÊN MỤC LIÊN QUAN: