Màu RGB
Thuộc phần Tạo kiểu với CSS trong hành trình HTML của Coddy. Bài học 27 trên 76.
Trong CSS, màu RGB là cách chỉ định màu bằng ký pháp hàm rgb(). RGB là viết tắt của đỏ, xanh lá và xanh dương. Mỗi màu được biểu thị bằng một giá trị từ 0 đến 255. Bằng cách kết hợp các mức độ đậm nhạt khác nhau của ba màu cơ bản này, bạn có thể tạo ra nhiều màu sắc đa dạng.
Đây là cú pháp cơ bản để dùng màu RGB trong CSS:
selector {
color: rgb(red, green, blue);
background-color: rgb(red, green, blue);
}Ví dụ:
p {
color: rgb(255, 0, 0); /* Đỏ */
background-color: rgb(0, 255, 0); /* Xanh lá */
}
h1 {
color: rgb(0, 0, 255); /* Xanh dương */
}
.highlight {
background-color: rgb(255, 255, 0); /* Vàng */
}Thử thách
DễBạn được cung cấp một tài liệu HTML có tiêu đề (<h1>), đoạn văn (<p>) và phần tử phân vùng (<div>). Hãy chọn màu nền và màu chữ cho tất cả phần tử trên trang, dùng rgb() để thực hiện.
Không chấp nhận màu mặc định!
Tự làm thử
<html>
<head>
<title>RGB Colors</title>
<style>
/* Write CSS rules here */
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<div>This is a division.</div>
</body>
</html>Bài học này có một bài trắc nghiệm ngắn. Bắt đầu bài học để trả lời và theo dõi tiến độ.
Tất cả bài học trong Tạo kiểu với CSS
3Bộ chọn cơ bản
Giới thiệu về bộ chọnBộ chọn kiểuBộ chọn lớpBộ chọn IDBộ chọn nhómBộ chọn phổ quátThử thách về bộ chọn9Flexbox
Flexbox là gì?Hướng flexCăn chỉnh nội dungCăn chỉnh các phần tửCăn giữa hoàn hảoThử thách Flexbox12Kiến thức cơ bản về thiết kế đáp ứng
Thiết kế đáp ứng là gì?Thẻ meta viewportBố cục linh hoạtĐơn vị viewportKiến thức cơ bản về media queryHình ảnh linh hoạtTự luyện tập: Playground Web