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

1. NHẬN BIẾT (4 CÂU)

Câu 1: Hệ màu RGB trong CSS gồm những thành phần nào và giá trị của chúng nằm trong khoảng nào?

Trả lời:

Hệ màu RGB trong CSS bao gồm ba thành phần: Red (R), Green (G), và Blue (B). Mỗi thành phần có giá trị nằm trong khoảng từ 0 đến 255.

Câu 2: Hệ màu HSL trong CSS gồm những thành phần nào?

Trả lời:

Hệ màu HSL trong CSS bao gồm ba thành phần: Hue (H), Saturation (S), và Lightness (L).

Câu 3: CSS hỗ trợ bao nhiêu tên màu chuẩn theo CSS2 và CSS3?

Trả lời:

CSS2 hỗ trợ 16 tên màu chuẩn, còn CSS3 mở rộng với 140 tên màu.

Câu 4: Thuộc tính nào trong CSS dùng để định dạng màu chữ?

Trả lời:

Thuộc tính color trong CSS dùng để định dạng màu chữ.

2. THÔNG HIỂU (4 CÂU)

Câu 1: Giải thích cách sử dụng giá trị RGB trong CSS

Trả lời:

Giá trị RGB trong CSS có thể sử dụng theo ba cách: rgb(x-red, x-green, x-blue), rgb(x-red%, x-green%, x-blue%), hoặc #rrggbb, trong đó x-red, x-green, x-blue là các giá trị màu đỏ, xanh lá và xanh dương, có thể là số nguyên từ 0 đến 255 hoặc phần trăm của 255.

Câu 2: Hệ màu HSL có những đặc điểm gì và cách sử dụng chúng trong CSS?

Trả lời:

Hệ màu HSL có ba thành phần: Hue (H) thể hiện góc màu từ 0 đến 360 độ, Saturation (S) thể hiện độ bão hòa màu từ 0% (màu xám) đến 100% (màu đầy đủ), và Lightness (L) thể hiện độ sáng từ 0% (đen) đến 100% (trắng). Để sử dụng trong CSS, giá trị HSL có dạng hsl(H, S%, L%).

Câu 3: CSS có những thuộc tính nào để định dạng màu nền và khung viền?

Trả lời:

Trong CSS, thuộc tính background-color dùng để định dạng màu nền, còn thuộc tính border dùng để định dạng màu khung viền.

Câu 4: Viết CSS để định dạng màu sắc cho một trang web sử dụng hệ màu RGB với màu đỏ cho chữ và màu xanh cho nền.

Trả lời:

body {

color: rgb(255, 0, 0); /* Màu chữ đỏ */

background-color: rgb(0, 0, 255); /* Màu nền xanh */

}

3. VẬN DỤNG (3 CÂU)

Câu 1: Sử dụng hệ màu HSL để tạo một màu sắc xanh lá cây với độ bão hòa 80% và độ sáng 50%, sau đó áp dụng để định dạng màu chữ cho một phần tử.

Trả lời:

h1 {

color: hsl(120, 80%, 50%); /* Màu xanh lá cây */

}

Câu 2: Sử dụng hệ màu HSL để tạo một màu sắc xanh lá cây với độ bão hòa 80% và độ sáng 50%, sau đó áp dụng để định dạng màu chữ cho một phần tử.

Trả lời:

h1 {

color: hsl(120, 80%, 50%); /* Màu xanh lá cây */

}

Câu 3: Tạo một CSS để làm nền trang web màu xám và màu chữ là trắng.

Trả lời:

body {

background-color: rgb(169, 169, 169); /* Màu xám */

color: white; /* Màu chữ trắng */

}

4. VẬN DỤNG CAO (2 CÂU)

Câu 1: Giải thích cách sử dụng dấu * trong bộ chọn CSS và ví dụ về cách áp dụng nó.

Trả lời:

* {

color: black; /* Tất cả các phần tử có màu chữ đen */

}

Câu 2: Viết một đoạn CSS để định dạng màu cho các phần tử trong trang web sao cho các tiêu đề h1 có màu chữ đỏ, các phần tử p có màu chữ xanh lá cây và các phần tử span có màu chữ vàng.

Trả lời:

h1 {

color: red; /* Màu chữ đỏ */

}

p {

color: green; /* Màu chữ xanh lá cây */

}

span {

color: yellow; /* Màu chữ vàng */