Giáo án và PPT Khoa học máy tính 12 kết nối bài 13: Khái niệm, vai trò của CSS

BÀI 13: KHÁI NIỆM, VAI TRÒ CỦA CSS (2 tiết)

A. KHỞI ĐỘNG

-HS dựa vào hiểu biết để trả lời các câu hỏi phần Khởi động tr.71 SGK.

B. HOẠT ĐỘNG HÌNH THÀNH KIẾN THỨC

1. Khái niệm mẫu định dạng CSS

GV tổ chức cho HS tìm hiểu hoạt động và trình bày khái niệm về CSS?

Kết luận:

- CSS là định dạng độc lập với chuẩn HTML, được dùng để thiết lập các mẫu định dạng dùng trong trang web.

2. Cấu trúc CSS

Trình bàu cấu trúc tổng quát của một mẫu định dạng CSS?

Kết luận:

- Cấu trúc tổng quát của một mẫu định dạng CSS có hai phần: 

+ Bộ chọn (selector): quy định những thẻ HTML nào được chọn để áp dụng định dạng này.

+ Vùng mô tả (declaration block): bao gồm một hay nhiều quy định có dạng

, các quy định được viết cách nhau bởi dấu ";". 

3. Vai trò, ý nghĩa của CSS

GV tổ chức cho HS tìm hiểu hoạt động và trình bày ý nghĩa và vai trò của CSS?

Kết luận:

- Ý nghĩa: Nếu không dùng CSS thì khi định dạng nội dung trang web ta phải thực hiện thông qua việc thiết lập các thuộc tính cho từng phần tử HTML.

- Vai trò: CSS ra đời để phục vụ việc định dạng nội dung trang web một cách thống nhất, nhanh chóng và thuận tiện:

+ CSS tách việc nhập nội dung trang web bằng thẻ HTML và việc định dạng thành hai công việc độc lập với nhau. 

Giúp giảm nhẹ công việc nhập nội dung, tăng tính chuyên nghiệp của việc định dạng.

+ Các mẫu định dạng của CSS có thể được viết ngay trong phần head của trang HTML, chỉ cần viết một lần và áp dụng cho tất cả các phần tử trong bộ chọn. 

Các định CSS được thiết lập một lần và được dùng nhiều lần.

+ Các mẫu định dạng có thể viết trong tệp CSS ngoài và kết nối vào bất kì trang web nào. 

Tính năng này cho phép định dạng một lần và áp dụng cho nhiều trang web, thậm chí cả một website. Nếu một website (hay trang web) cần thay đổi định dạng thì có thể chỉ cần chỉnh sửa một lần.

C. HOẠT ĐỘNG LUYỆN TẬP

- GV giao nhiệm vụ cho HS, HS hoàn thành phiếu bài tập.

Đáp án gợi ý:

D. HOẠT ĐỘNG VẬN DỤNG

GV hướng dẫn HS hoàn thành bài tập phần Vận dụng SGK tr.75.