Giáo án điện tử Khoa học máy tính 12 kết nối Bài 15: Tạo màu cho chữ và nền

BÀI 15: TẠO MÀU CHO CHỮ VÀ NỀN

KHỞI ĐỘNG

Các định dạng sau có thiết lập cùng một màu hay không? Em có nhận xét gì về thiết lập này?

1. HỆ THỐNG MÀU CỦA CSS

Hoạt động 1: Tìm hiểu cách biểu diẽn màu trong HTML và CSS

Cùng thảo luận và tìm hiểu hệ màu RGB hỗ trợ bởi HTML và CSS

Các màu cơ bản red, yellow, green, blue, magentam cyan được thể hiện bằng hàm hsl như thế nào?

Trong hệ màu rgb có bao nhiêu màu thuộc màu xám?

Hoạt động 2: Tìm hiểu cách thiết lập màu chữ và màu nền bằng CSS

Cùng thảo luận về cách thiết lập màu trong các mẫu CSS và trả lời các câu hỏi sau:

1. Cách thiết lập định dạng màu chữ trong CSS như thế nào?

2. Cách thiết lập màu nền cho các phần tử CSS như thế nào?

2. THIẾT LẬP BỘ CHỌN LÀ TỔ HỢP CÁC PHẦN TỬ CÓ QUAN HỆ

Hoạt động 3: Tìm hiểu cách thiết lập bộ chọn là tổ hợp các phần tử

Quan sát, trao đổi và thảo luận về 4 trường hợp bộ chọn là tổ hợp các phần tử, nêu ý nghĩa và sự khác biệt giữa các trường hợp này: E F, E > F, E + F và E ~ F.

Trong ví dụ ở Hình 15.7, nếu thay mẫu em ~ strong bằng p > strong thì kết quả sẽ như thế nào?

Trong ví dụ ở Hình 15.7 nếu thay mẫu em ~ strong bằng em + strong thì kết quả sẽ như thế nào?

Trong ví dụ ở Hình 15.7, nếu thay mẫu em ~ strong bằng p strong thì kết quả sẽ như thế nào?

LUYỆN TẬP

Thiết lập hệ màu cơ bản (17 mảu của CSS2.1) theo bộ ba tham số R, G, B.

Khi nào các mẫu định dạng E F và E > F có tác dụng như nhau?

VẬN DỤNG

Tìm ví dụ và giải thích ý nghĩa cho các mẫu định dạng CSS tổng quát như sau:

a) E1 E2 E3.

b) E1 > E2 >E3.

Tìm ví dụ và giải thích ý nghĩa cho các mẫu định dạng CSS tổng quát như sau:

a) E + F + G.

b) E > F + G.