Ngày soạn:…/…/… Ngày dạy:…/…/…
BÀI F2: TẠO VÀ ĐỊNH DẠNG TRANG WEB VỚI CÁC THẺ HTML (2 tiết) I. MỤC TIÊU 1. Kiến thức
Sau bài học này, HS sẽ:
- Sử dụng được các thẻ HTML để trình bày trang web.
- Định dạng văn bản, phông chữ, tạo liên kết, danh sách. 2. Năng lực
Năng lực chung:
- Tự chủ và tự học: Tự lực (Chủ động, tích cực thực hiện công việc của bản thân).
- Giao tiếp và hợp tác: Xác định trách nhiệm và hoạt động của bản thân (Phân
tích được các công việc cần thực hiện để hoàn thành nhiệm vụ của nhóm trong các hoạt động nhóm).
- Giải quyết vấn đề và sáng tạo: Hình thành và triển khai ý tưởng mới (Nêu được
nhiều ý tưởng mới trong học tập, suy nghĩ không theo lối mòn, tạo ra yếu tố
mới dựa trên những ý tưởng khác nhau).
Năng lực Tin học:
- NLc (Giải quyết vấn đề với sự hỗ trợ của công nghệ thông tin và truyền thông):
Trình bày trang web bằng thẻ HTML và định dạng văn bản, phông chữ, tạo liên kết, danh sách. 3. Phẩm chất
- Chăm chỉ: Tích cực tìm tòi và sáng tạo trong việc học tập.
- Trách nhiệm: Tích cực, tự giác và nghiêm túc rèn luyện sử dụng thành thạo các mã lệnh. 1
II. THIẾT BỊ DẠY HỌC VÀ HỌC LIỆU
1. Đối với giáo viên
- SGK, SBT Tin học 12 – Định hướng Tin học ứng dụng – Chân trời sáng tạo,
bài trình chiếu (Slide), máy chiếu, phiếu học tập.
- Máy tính có cài sẵn phần mềm Visual Studio Code và có kết nối Internet, các
tệp HTML dùng trong hoạt động Thực hành.
2. Đối với học sinh
SGK, SBT Tin học 12 – Định hướng Tin học ứng dụng – Chân trời sáng tạo, vở ghi.
III. TIẾN TRÌNH DẠY HỌC
A. HOẠT ĐỘNG KHỞI ĐỘNG
a) Mục tiêu: Tạo động lực để HS muốn tìm hiểu về các thẻ HTML để trình bày và định dạng văn bản.
b) Nội dung: HS nghiên cứu nội dung hoạt động Khởi động SGK trang 106, suy nghĩ
trả lời câu hỏi theo kiến thức của mình.
c) Sản phẩm: Từ yêu cầu, HS vận dụng sự hiểu biết để trả lời câu hỏi Khởi động SGK trang 106.
d) Tổ chức thực hiện:
Bước 1: GV chuyển giao nhiệm vụ:
- GV yêu cầu HS hoạt động cá nhân, suy nghĩ trả lời câu hỏi Khởi động tr.106 SGK:
Trong Hình 1, mỗi dòng trên trang web được định nghĩa bằng thẻ nào trong số các
thẻ sau: , ,
,
? 2
Hình 1. Kết xuất trang web khi sử dụng các thẻ , ,
,
Bước 2: HS thực hiện nhiệm vụ học tập:
- HS quan sát hình ảnh, vận dụng sự hiểu biết để trả lời câu hỏi.
- GV quan sát và hỗ trợ HS khi cần thiết.
Bước 3: Báo cáo kết quả hoạt động, thảo luận:
- GV mời một số HS xung phong trả lời câu hỏi Khởi động tr.106 SGK.
Gợi ý trả lời:
+ Dòng “Danh sách tài liệu tham khảo” được tạo bằng thẻ .
+ Dòng “Tài liệu thiết kế trang web”, “Tài liệu tin học văn phòng” được tạo bằng thẻ .
+ Hai đường ngăn cách nằm ngang được tạo bằng thẻ .
+ Các dòng còn lại được tạo bằng thẻ
.
- HS khác lắng nghe, nhận xét và bổ sung.
Bước 4: Đánh giá kết quả thực hiện:
GV đánh giá kết quả của HS, dẫn dắt HS vào bài học mới: Trong ví dụ ở phần Khởi
động, dòng “Danh sách tài liệu tham khảo” được tô màu đỏ. Điều này là do sử dụng
thêm thẻ HTML để định dạng màu sắc cho dòng chữ đó. Vậy để giúp các em tìm hiểu
các thẻ định dạng được nội dung trên trang web tương tự như vậy, chúng ta sẽ cùng
nhau đến với Bài F2: Tạo và định dạng trang web với các thẻ HTML.
B. HÌNH THÀNH KIẾN THỨC MỚI
Hoạt động 1: Các thẻ định dạng cơ bản a) Mục tiêu:
- Trình bày trang web đúng cấu trúc theo ngôn ngữ HTML.
- Sử dụng được các thẻ HTML cơ bản để trình bày trang web như thẻ:
, , , , , .
- Sử dụng được thẻ và các thuộc tính đi kèm để định dạng kích thước, màu sắc và kiểu chữ. 3
- Sử dụng các thẻ định dạng văn bản như , , , , , ,...
b) Nội dung: GV giao nhiệm vụ; HS tìm hiểu nội dung mục 1. Các thẻ định dạng cơ
bản để thực hiện nhiệm vụ.
c) Sản phẩm: HS biết cách sử dụng các thẻ định dạng cơ bản.
d) Tổ chức thực hiện:
HOẠT ĐỘNG CỦA GV VÀ HS
SẢN PHẨM DỰ KIẾN
a) Định dạng đề mục
1. Các thẻ định dạng cơ bản
Bước 1: GV chuyển giao nhiệm vụ:
a) Định dạng đề mục
- GV yêu cầu HS hoạt động cá nhân và - HTML sử dụng các thẻ , , trả lời các câu hỏi: , , và để định
+ HTML sử dụng thẻ nào để định dạng nghĩa các đề mục của trang web theo từng đề mục? cấp độ, trong đó:
+ Các cấp độ đề mục được phân biệt như + là đề mục cấp cao nhất. thế nào?
+ là đề mục cấp thấp nhất.
Bước 2: HS thực hiện nhiệm vụ học + Đề mục cấp cao hơn sẽ có kích thước tập: chữ lớn hơn.
- HS tìm hiểu nội dung mục 1a SGK Ví dụ 1: Đoạn mã HTML sau minh hoạ
tr.106 và thực hiện nhiệm vụ.
các thẻ từ đến . Kết quả hiển
- GV quan sát và trợ giúp HS. thị như Hình 2.
Bước 3: Báo cáo kết quả hoạt động, thảo luận:
- HS trả lời câu hỏi và nhận xét lẫn nhau.
Bước 4: Đánh giá kết quả thực hiện:
- GV nêu nhận xét, chính xác hoá lại các
nội dung trả lời của HS. 4
Nhắn tin Zalo