tailieunhanh - Bài giảng CSS - Bài 5: Màu trong CSS

Bài giảng cung cấp cho người học các kiến thức: Màu trong CSS, định kiểu màu, sử dụng màu theo tên tiếng Anh, giá trị màu RGB, màu hệ thập lục phân,. Hi vọng đây sẽ là một tài liệu hữu ích dành cho các bạn sinh viên đang theo học môn dùng làm tài liệu học tập và nghiên cứu. chi tiết nội dung tài liệu. | Bài 5: Màu trong CSS BỞI TRỊNH HỒNG Có nhiều cách định kiểu màu trong CSS, thường được sử dụng theo các cách sau: Theo tên tiếng anh – ví dụ: “Red”- màu đỏ Theo kết hợp giá trị màu RGB – ví dụ: “rgb(255, 0, 0)”- màu đỏ Theo hệ thập lục phân HEX – ví dụ: “#ff0000” – màu đỏ Sử dụng màu theo tên tiếng anh Một số màu cơ bản hay dùng có tên tương ứng như dưới đây: Chú ý: Tên màu sắc trong CSS không phân biệt giữa chữ hoa và chữ thường: “Red” sẽ cho kết quả giống như “red” hoặc “RED”. HTML và CSS hỗ trợ 140 tên màu sắc chuẩn. Ví dụ Xác định màu theo kết hợp giá trị màu RGB RGB là sự kết hợp của 3 màu cơ bản: đỏ (Red), xanh lá cây (Green) và xanh dương (Blue) Các tham số (red, green, blue) xác định cường độ màu sắc từ 0 đến 255. Tổng quát: rgb( giá trị 1, giá trị 2, giá trị 3) Ví dụ như rgb(255,0,0)là giá trị của màu “Đỏ”, bởi vì màu đỏ đươc thiết lập giá trị cao nhất là 255, còn các giá trị khác đều được thiết lập là 0. Ta có thể hiểu hơn bằng cách kết hợp các giá trị màu RGB dựa vào thang màu như dưới đây: Ví dụ Các màu xám được thiết lập bằng cách sử dụng 3 giá trị cho mỗi màu giống nhau. Ví dụ Sử dụng màu theo hệ thập lục phân – HEX HEX là viết tắc của từ “Hexadecimal”. Giá trị màu RGB cũng có thể được xác định bằng cách sử dụng các giá trị màu theo hệ thập lục phân ở dạng: #RRGGBB, trong đó RR (màu đỏ), GG (màu xanh lá cây) và BB (màu xanh) là các giá trị thập lục phân giữa 00 và FF (tương tự thập phân 0-255). Ví dụ: #FF0000 là gía trị hiển thị màu đỏ, bởi vì màu đỏ đươc thiết lập giá trị cao nhất là FF, còn các giá trị khác đều được thiết lập giá trị thấp nhất là 00 Lưu ý: – Cách viết: Gồm dấu “#” kết hợp với dãy ký tự Latin, bao gồm số hoặc chữ (hệ 16 hay hệ thập lục phân), Không phân biệt chữ hoa chữ thường: “# ff0000” cũng giống như “FF0000”. Các ký tự Latin có thể chấp nhận là: a,b,c,d,e,f,A,B,C,D,E,F. – Ta có thể viết rút gọn màu theo các cách sau: Rút gọn 6 ký tự giống nhau thành 3 ký tự: #ffffff => #fff Rút gọn 3 cặp ký tự thành 3 ký tự: #ff0066 => #f06 Ví dụ | Bài 5: Màu trong CSS BỞI TRỊNH HỒNG Có nhiều cách định kiểu màu trong CSS, thường được sử dụng theo các cách sau: Theo tên tiếng anh – ví dụ: “Red”- màu đỏ Theo kết hợp giá trị màu RGB – ví dụ: “rgb(255, 0, 0)”- màu đỏ Theo hệ thập lục phân HEX – ví dụ: “#ff0000” – màu đỏ Sử dụng màu theo tên tiếng anh Một số màu cơ bản hay dùng có tên tương ứng như dưới đây: Chú ý: Tên màu sắc trong CSS không phân biệt giữa chữ hoa và chữ thường: “Red” sẽ cho kết quả giống như “red” hoặc “RED”. HTML và CSS hỗ trợ 140 tên màu sắc chuẩn. Ví dụ Xác định màu theo kết hợp giá trị màu RGB RGB là sự kết hợp của 3 màu cơ bản: đỏ (Red), xanh lá cây (Green) và xanh dương (Blue) Các tham số (red, green, blue) xác định cường độ màu sắc từ 0 đến 255. Tổng quát: rgb( giá trị 1, giá trị 2, giá trị 3) Ví dụ như rgb(255,0,0)là giá trị của màu “Đỏ”, bởi vì màu đỏ đươc thiết lập giá trị cao nhất là 255, còn các giá trị khác đều được thiết lập là 0. Ta có thể hiểu hơn bằng cách kết hợp các giá trị màu RGB dựa vào thang