Giáo án Tin học 12 Kết nối tri thức Bài 14: Định dạng văn bản bằng CSS

Giáo án Tin học 12 Kết nối tri thức Bài 14: Định dạng văn bản bằng CSS

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 Kết nối tri thức bản word chuẩn kiến thức, trình bày đẹp mắt, dễ dàng chỉnh sửa:

• B1: gửi phí vào tk: 0711000255837 - NGUYEN THANH TUYEN - Ngân hàng Vietcombank (QR)
• B2: Nhắn tin tới Zalo VietJack Official - nhấn vào đây để thông báo và nhận giáo án

I. MỤC TIÊU

1. Kiến thức

Học sinh được học về:

- Cách khai báo các thuộc tính định dạng phông chữ, màu sắc chữ, dòng văn bản.

- Tính kế thừa của các mẫu định dạng CSS.

- Cách chọn theo thứ tự của các mẫu định dạng CSS.

2. Năng lực

- Sử dụng được CSS để định dạng văn bản.

- Nâng cao khả năng tự học.

3. Phẩm chất

- Có ý thức chủ động tìm hiểu và cập nhật các kiến thức mới.

- Cẩn thận, tỉ mỉ khi viết các câu lệnh.

- Nâng cao tinh thần trách nhiệm khi làm việc nhóm.

II. THIẾT BỊ DẠY HỌC VÀ HỌC LIỆU

- GV chuẩn bị:

• SGK, bài giảng PPT, phòng máy tính có kết nối Internet, máy chiếu.

• Chuẩn bị các ví dụ minh hoạ tương ứng trong bài như mô tả SGK, có thể sử dụng mô phỏng cho HS trên lớp, không mất thời gian gõ lại.

- HS: SGK, vở ghi, chuẩn bị bài ở nhà.

III. TIẾN TRÌNH DẠY HỌC

Bài học được thực hiện trong 2 tiết: 1 tiết lí thuyết, 1 tiết thực hành.

- Tiết lí thuyết: Hoạt động 1,2,3

- Tiết thực hành: Hoạt động 4,5,6

A. MỞ ĐẦU

Hoạt động 1: Khởi động (10 phút)

a) Mục tiêu

- HS định hướng được những nội dung định dạng văn bản có thể thực hiện được.

- Ôn tập lại kiến thức bài cũ, khơi gợi nhu cầu học tập nội dung mới.

b) Tổ chức thực hiện

- GV tổ chức hoạt động theo kĩ thuật KWL.

- GV chuẩn bị ví dụ 1 trang web (trang web giới thiệu lịch sử nhà trường/ trang web giới thiệu về các CLB, trang web các hoạt động của lớp), chưa được định dạng. GV đưa ra câu hỏi:

1. Em sẽ định dạng nội dung trang web như thế nào cho đúng, đẹp, nổi bật?

2. Em đã biết cách thực hiện nội dung nào? Chưa biết cách thực hiện nội dung nào?

- HS suy nghĩ trả lời.

HS sẽ đưa ra cách trình bày văn bản của mình. GV ghi nhận các ý kiến của HS (lấy làm chuẩn để sau này đối chiếu kết quả)

HS đã biết cách thay đổi màu, lùi đầu dòng dòng đầu, tạo đường viền bao quanh (bài 13)

- Từ câu trả lời của HS, GV phân tích về tính hợp lí về sản phẩm mẫu cần hướng đến, trường hợp HS đưa ra những ý kiến chưa hợp lí về trình bày, GV cần hướng HS đến tiêu chuẩn phù hợp. Từ các nội dung HS chưa biết, GV dẫn dắt vào nội dung bài.

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

Hoạt động 2. Tìm hiểu về cách định dạng văn bản bằng CSS (25 phút)

a) Mục tiêu

- HS biết được tên, ý nghĩa các thuộc tính định dạng văn bản và giá trị có thể nhận của các thuộc tính đó.

b) Tổ chức thực hiện

# 1. Chuyển giao nhiệm vụ

- GV nhắc lại cấu trúc mẫu định dạng CSS được học ở bài 13 (Bộ chọn {thuộc tính: giá trị;}) ➔ Muốn định dạng văn bản, chỉ cần tìm hiểu các thuộc tính và giá trị tương ứng để định dạng văn bản.

- GV chia lớp thành 3 nhóm lớn, mỗi nhóm lớn chia thành các nhóm nhỏ 3-4 HS. Mỗi nhóm lớn tìm hiểu một nội dung tương ứng 1a,1b,1c trong SGK với gợi ý các nội dung cần tìm hiểu.

- GV gợi ý HS tìm hiểu trong SGK, đồng thời giới thiệu trang web tham khảo (https://www.w3schools.com/cssref/index.php). GV hướng dẫn HS cách tìm kiếm thuộc tính, nhóm các thuộc tính liên quan nhau, ý nghĩa thuộc tính và xem kết quả minh hoạ với mỗi ví dụ.

- GV Nêu rõ yêu cầu HS tìm hiểu tất cả các thuộc tính trong nhóm (ngoài SGK, tìm hiểu thêm trên web), HS ghi chú các nội dung chuẩn bị báo cáo. HS thực hành sử dụng các thuộc tính để định dạng trang web mẫu từ HĐ trên.

- Sau khi HS báo cáo và hoàn thiện sản phẩm, GV giao nhiệm vụ HS trả lời câu hỏi tự luyện trang 79.

Nội dung: 1. Định dạng văn bản bằng CSS a. Định dạng phông chữ b. Định dạng màu sắc c. Định dạng dòng văn bản. - Với mỗi nội dung, tìm hiểu về tên thuộc tính, ý nghĩa, giá trị, ví dụ áp dụng. 2. Thực hành định dạng trang web, áp dụng các thuộc tính tìm hiểu được 3. Câu hỏi tự luyện trang 79

# 2. Thực hiện nhiệm vụ

- HS hoạt động nhóm, nghiên cứu SGK, nghiên cứu trang web, xem ví dụ minh hoạ trực quan, ghi chú các nội dung tìm hiểu được.

- HS thực hành áp dụng các thuộc tính tìm hiểu được để định dạng trang web như phân tích từ hoạt động khởi động.

- GV quan sát, hỗ trợ các nhóm HS.

- HS trả lời nhanh các câu hỏi tự luyện trang 79.

Kết quả: 1. Định dạng văn bản bằng CSS a) Định dạng phông chữ
	Thuộc tính	Ý nghĩa	Giá trị	Ví dụ
	font-family	Thiết lập phông chữ	Tên phông chữ cụ thể Hoặc tên các kiểu phông chữ có chân (serif), không chân (sans-serif), chữ có chiều rộng đều nhau (monospace), chữ viết tay (cursive), fantasy (chữ trừu tượng)	h1 {font-family: Impact;}
	font-size	Cỡ chữ	- Cỡ chữ theo đơn vị đo chính xác tuyệt đối: px, in, pt - Cỡ chữ theo đơn vị đo tương đối: em, ex, rem - Cỡ chữ theo tỉ lệ % cỡ chữ của phần tử cha - Cỡ chữ theo các mức xx-small, x- small, small, medium, large, x-large, xx-large
	font-style	Kiểu chữ	normal, italic
	font- weight	Kiểu chữ đậm	normal, bold, Hoặc mức độ 100,200,300,…,900

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

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

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

(Nguồn: NXB Giáo dục)

Trên đây tóm tắt một số nội dung miễn phí trong bộ Giáo án Tin học 12 Kết nối tri thức 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 Kết nối tri thức hay, chuẩn khác:

• Giáo án Tin 12 Bài 15: Tạo màu cho chữ và nền

• Giáo án Tin 12 Bài 16: Định dạng khung

• Giáo án Tin 12 Bài 17: Các mức ưu tiên của bộ chọn

• Giáo án Tin 12 Bài 18: Thực hành tổng hợp thiết kế trang web

• Giáo án Tin 12 Bài 19: Dịch vụ sửa chữa và bảo trì máy tính

---