Giáo án và PPT Khoa học máy tính 12 cánh diều bài 8: Làm quen với CSS
Đồng bộ giáo án word và powerpoint (ppt) bài 8: Làm quen với CSS. Thuộc chương trình Tin học 12 Khoa học máy tính Cánh diều. Giáo án được biên soạn chỉnh chu, hấp dẫn. Nhằm tạo sự lôi cuốn và hứng thú học tập cho học sinh.
Giáo án ppt đồng bộ với word
Còn nữa....
Các tài liệu bổ trợ khác
Xem toàn bộ: Trọn bộ giáo án và PPT Khoa học máy tính 12 cánh diều
BÀI 8: LÀM QUEN VỚI CSS
A. KHỞI ĐỘNG
HS dựa vào hiểu biết để trả lời các câu hỏi.
B. HOẠT ĐỘNG HÌNH THÀNH KIẾN THỨC
Hoạt động 1: Bảng định dạng CSS
+ Bảng định dạng CSS là gì?
+ Bảng định dạng CSS được khai báo như thế nào?
+ CSS có vai trò như thế nào trong việc định dạng trang web?
+ Trình duyệt web áp dụng CSS như thế nào?
Dự kiến sản phẩm:
- Khái niệm: Bảng định dạng (Cascading Style Sheets - CSS) là ngôn ngữ được sử dụng để khai báo kiểu trình bày các phần tử HTML trong trang web.
- Cấu trúc: CSS thường gồm một số quy tắc định dạng. Mỗi quy tắc định dạng gồm bộ chọn (selector) và các khai báo thuộc tính CSS (css properties) để xác định kiểu trình bày cho phần tử như màu sắc, phông chữ, kích cỡ, đường viền,...
Hình 1. Một ví dụ CSS có hai quy tắc định dạng
Hoạt động 2: Khai báo bộ chọn phần tử và áp dụng CSS
+ Bộ chọn phần tử được dùng để làm gì?
+ CSS định nghĩa bộ chọn với mỗi phần tử HTML như thế nào?
+ Bộ chọn phần tử được khai báo như thế nào?..
Dự kiến sản phẩm:
- Bộ chọn phần tử thường được dùng để áp dụng CSS cho một hoặc nhiều phần tử cụ thể trong văn bản HTML nhằm tạo sự thống nhất trong trình bày.
Ví dụ: Trình bày chữ in nghiêng cho các đoạn văn bản trên trang web.
- Với mỗi phần tử HTML, CSS định nghĩa một bộ chọn tương ứng và đặt tên theo tên phần tử đó…
Hoạt động 3: Một số thuộc tính định dạng CSS
+ Trong CSS, thuộc tính định dạng màu chữ và màu nền được khai báo như thế nào?
Dự kiến sản phẩm:
- Thuộc tính color định dạng màu chữ, được khai báo như sau:
Trong đó, giá trị Màu thường được xác định bởi tên màu phổ biến như red, green, blue, yellow, brown,…
Ví dụ 5: Văn bản HTML trong Hình 6a trình bày các phần tử h1, h2 có màu xanh nước biển, phần tử p có màu đỏ khi hiển thị trên màn hình trình duyệt web (Hình 6b)…
C. HOẠT ĐỘNG LUYỆN TẬP
Câu 1. Các quy tắc định dạng internal CSS được viết trong cặp thẻ nào?
A. <title></title>.
B. <style></style>.
C. <body></body>.
D. <meta></meta>.
Câu 2. Cú pháp khai báo bộ chọn phần tử là
A. Tên_bộ_chọn_phần_tử {thuộc tính=giá trị;}.
B. Tên_bộ_chọn_phần_tử {thuộc tính: giá trị,}.
C. Tên_bộ_chọn_phần_tử {thuộc tính-giá trị,}.
D. Tên_bộ_chọn_phần_tử {thuộc tính: giá trị;}.
Câu 3. Khai báo áp dụng external CSS nào sau đây đúng cú pháp?
A. <link rel=“stylesheet” src=“styles.css”>.
B. <link rel=“stylesheet” link=“styles.css”>.
C. <link rel=“stylesheet” href=“styles.css”>.
D. <link rel=“stylesheet” url=“styles.css”>.
Câu 4. Bảng định dạng CSS gồm hai quy định, chữ màu nâu và cỡ chữ 12 cho tất cả các thẻ p là
A. p {font-color: brown; font-size: 12px;}.
B. p {color: brown; text-size: 12px;}.
C. p {color: brown; font-size: 12px;}.
D. p {text-color: brown; font-size: 12px;}.
Câu 5. Để định dạng kiểu chữ đậm, em sử dụng thuộc tính nào sau đây?
A. font-style.
B. font-weight.
C. font-size.
D. font-family.
Dự kiến sản phẩm:
Câu hỏi | 1 | 2 | 3 | 4 | 5 |
Đáp án | B | D | C | C | B |
D. HOẠT ĐỘNG VẬN DỤNG
HS hoàn thành hoạt động Vận dụng SGK tr.73.
Trên chỉ là 1 phần của giáo án. Giáo án khi tải về có đầy đủ nội dung của bài. Đủ nội dung của học kì I + học kì II
MỘT VÀI THÔNG TIN:
- Word được soạn: Chi tiết, rõ ràng, mạch lạc
- Powerpoint soạn: Hiện đại, đẹp mắt để tạo hứng thú học tập
- Word và powepoint đồng bộ với nhau
Thời gian bàn giao giáo án
- Khi đặt, nhận giáo án kì I
- Sau đó, bổ sung liên tục để 30/01 có đủ cả năm
Phí giáo án
- Giáo án word: 400k
- Giáo án Powerpoint: 500k
- Trọn bộ word + PPT: 800k
=> Chỉ gửi trước 350k. Phần còn lại gửi dần khi nhận giáo án. Đến lúc nhận đủ kì 1 thì gửi số còn lại
Khi đặt nhận ngay và luôn:
- Giáo án word: nhận kì I
- Giáo án Powerpoint: nhận kì I
- Mẫu đề thi với ma trận, thang điểm, lời giải chi tiết
- 10 - 12 phiếu trắc nghiệm cấu trúc mới
Cách đặt:
- Bước 1: Gửi phí vào tk: 10711017 - Chu Văn Trí - Ngân hàng ACB (QR)
- Bước 2: Nhắn tin tới Zalo Fidutech - nhấn vào đây để thông báo và nhận giáo án
Xem toàn bộ: Trọn bộ giáo án và PPT Khoa học máy tính 12 cánh diều