Giáo án Tin học 12 Chân trời sáng tạo Bài F7: Giới thiệu CSS

Trang trước Trang sau

Xem thử

Chỉ từ 400k mua trọn bộ Kế hoạch bài dạy (KHBD) hay Giáo án Tin học 12 Chân trời sáng tạo bản word chuẩn kiến thức, trình bày đẹp mắt, dễ dàng chỉnh sửa:

I. MỤC TIÊU

1. Kiến thức

Sau bài học này, HS sẽ:

- Biết được ngôn ngữ CSS.

- Biết được các cách bổ sung mã lệnh CSS trong một trang web.

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): Biết chèn mã lệnh CSS vào trang web.

3. Phẩm chất

- Chăm chỉ: Tích cực tìm tòi và sáng tạo trong việc tìm hiểu một khái niệm mới là CSS.

- Trung thực, trách nhiệm: Trung thực khi giới thiệu bản thân, tôn trọng bản quyền khi sử dụng thông tin, hình ảnh để xây dựng trang web.

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 và CSS 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: Ôn lại kiến thức đã học và gợi ra các định dạng khác cho việc trình bày thẻ

như thay đổi màu sắc và đổ bóng.

b) Nội dung:HS dựa vào hiểu biết để trả lời các câu hỏi.

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 GV đưa ra.

d) Tổ chức thực hiện:

Bước 1: GV chuyển giao nhiệm vụ:

- GV chia lớp thành các nhóm 3 – 4 HS, sau đó nêu câu hỏi cho các nhóm thảo luận:

Quan sát trang web trong hình dưới đây và trả lời các câu hỏi sau:

Giáo án Tin học 12 Chân trời sáng tạo Bài F7: Giới thiệu CSS

+ Mã nguồn trang web có những phần tử HTML nào?

+ Định dạng các phần tử HTML này có đặc điểm chung nào?

+ Có thể định dạng mẫu một lần để áp dụng mẫu đó cho nhiều phần tử HTML được không?

Bước 2: HS thực hiện nhiệm vụ học tập:

- Các nhóm HS thảo luận và trả lời các câu hỏi.

- GV quan sát quá trình các nhóm thảo luận, giải đáp thắc mắc nếu HS chưa rõ.

Bước 3: Báo cáo kết quả hoạt động, thảo luận:

- GV mời một số nhóm báo cáo kết quả thảo luận.

Gợi ý trả lời:

· Mã nguồn trang web có phần tử

và phần tử

.

· 2 phần tử

có định dạng giống nhau.

· Có thể định dạng mẫu một lần để áp dụng mẫu đó cho nhiều phần tử HTML.

- Các nhóm khác lắng nghe và góp ý.

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 một trang web có thể có nhiều phần tử HTML được định dạng giống nhau. Khi đó chúng ta cần sử dụng một công cụ hỗ trợ giúp định dạng chung cho nhiều phần tử. Vậy để tìm hiểu về công cụ đó,chúng ta sẽ cùng nhau đến với Bài F7: Giới thiệu CSS.

B. HÌNH THÀNH KIẾN THỨC MỚI

Hoạt động 1: Khái niệm CSS

a) Mục tiêu: Cung cấp cho HS kiến thức về:

- Tác dụng của ngôn ngữ CSS (Cascading Style Sheets) trong thiết kế trang web.

- Các lợi ích khi sử dụng CSS.

b) Nội dung: GV giao nhiệm vụ; HS tìm hiểu nội dung mục 1. Khái niệm CSS và thực hiện nhiệm vụ.

c) Sản phẩm: Khái niệm, tác dụng và các lợi ích của CSS.

d) Tổ chức thực hiện:

HOẠT ĐỘNG CỦA GV VÀ HS

SẢN PHẨM DỰ KIẾN

Bước 1: GV chuyển giao nhiệm vụ:

- GV yêu cầu HS hoạt động cá nhân, tìm hiểu về khái niệm và lợi íchcủa CSS bằng cách trả lời các câu hỏi:

+ CSS là gì?

+ Sử dụng CSS trong thiết kế trang web có tác dụng như thế nào?

+ CSS mang lại những lợi ích gì trong việc xây dựng trang web?

- GV yêu cầu HS vận dụng kiến thức vừa tìm hiểu, trả lời câu hỏi hoạt động Làm tr.135 SGK:

Em hãy trình bày một số lợi ích của CSS trong việc xây dựng các trang web.

Bước 2: HS thực hiện nhiệm vụ học tập:

- HS tìm hiểu nội dung mục 1 SGK tr.134 – 135 vàtrả lời các câu hỏi mà GV đưa ra.

- GV quan sát, theo dõi 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:

- 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:

1. Khái niệm CSS

-Khái niệm:CSS (Cascading Style Sheets) là ngôn ngữ dùng để định kiểu các phần tử HTML trong trang web.

-Tác dụng của CSS:

· CSS hỗ trợ định kiểu cùng lúc nhiều phần tử HTML của một hoặc nhiều trang web, giúp mô tả bố cục, màu sắc, phông chữ và các khía cạnh trực quan khác của trang web.

· CSS có thể kiểm soát vị trí, kích thước, khoảng trống của các thành phần giúp đáp ứng những yêu cầu phức tạp về bố cục của trang web mà HTML không thể thực hiện được.

· CSS có thể tạo ra các hiệu ứng như đổ bóng, màu chuyển sắc, các hiệu ứng hoạt hình và chuyển cảnh sinh động.

· NếuHTML hướng đến việc định hình nội dung và cấu trúc (tiêu đề, đề mục, đoạn, hình ảnh, video,…) của trang web, thì CSS tập trung vào việc trình bày bố cục và hình thức của các thành phần trong trang web.

- CSS giúp mang lại nhiều lợi ích trong việc xây dựng trang web:

a) Linh hoạt về bố cục

................................

................................

................................

Trên đây tóm tắt một số nội dung miễn phí trong bộ Kế hoạch bài dạy (KHBD) hay Giáo án Tin học 12 Chân trời sáng tạo mới nhất, để mua tài liệu đầy đủ, Thầy/Cô vui lòng xem thử:

Xem thử

Xem thêm các bài soạn Giáo án Tin học lớp 12 Chân trời sáng tạo hay, chuẩn khác:

Trang trước Trang sau
Đề thi, giáo án lớp 12 các môn học