Trong thiết kế website, để có được một sản phẩm có thẩm mỹ điều không thể thiếu là cách sử dụng màu sắc hợp lý. Màu trong HTML & CSS được xác định theo các cách sau:
- Xác định màu theo hệ thập lục phân – HEX
- Xác định màu theo kết hợp màu RGB
- Xác định màu theo tên tiếng anh
Xác định màu theo hệ thập lục phân – HEX
HEX là viết tắc của từ “hexadecimal”.
- Cách viết: gồm dấu “#” kết hợp với dãy ký tự Latin, chỉ bao gồm số hoặc chữ (hệ thập lục phân), không phân biệt chữ hoa hay chữ thường.
- Các ký tự Latin có thể chấp nhận là: a,b,c,d,e,f,A,B,C,D,E,F.
- Ví dụ: #00ffff
- Ta có thể viết gút gọn màu này theo các cách sau:
- Gút gọn 6 ký tự giống nhau thành 3 ký tự: #ffffff => #fff
- Gút gọn 3 cặp ký tự thành 3 ký tự: #ff0066 => #f06
Xác định màu theo kết hợp màu RGB
Xác định màu theo 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ách viết: rgb(giá trị 1, giá trị 2, giá trị 3)
Với giá trị từ 0 tới 255. - Ví dụ: rgb(155,167,1)
- Một số giá trị đặc biệt:
- Màu đen: rgb(0,0,0)
- Màu đỏ: rgb(255,0,0)
- Màu xanh lá cây: rgb(0,255,0)
- Màu xanh dương: rgb(0,0,255)
- Màu vàng: rgb(255,255,0)
- Màu Trắng: rgb(255,255,255)
Xác định màu theo tên tiếng anh
- Cách viết: tên màu được viết theo tiếng anh.
- Ví dụ: blue
- Một số tên thường dùng:
- Màu đen: black
- Màu đỏ: red
- Màu xanh lá cây: green
- Màu xanh dương: blue
- Màu vàng: yellow
- Màu trắng: white
Nãy giờ mình lang man quên mất chưa vào chủ đề chính :D.
Một ngày nào đó bạn cần 1 function sinh ra ngẫu nhiên 1 màu nào đó để phục vụ cho project của bạn. Bạn hãy tận dụng hàm dechex() có sẵn trong PHP. Dưới đây là 1 mẫu ví dụ mà mình viết ra để tạo ngẫu nhiên 1 màu dùng hàm dechex:
1 2 3 |
function rand_color() { return substr('00000' . dechex(mt_rand(0, 0xffffff)), -6); } |
Mình kết hợp thêm hàm mt_rand() có tác dụng chạy ngẫu nhiên từ 0 -> 0xffffff.
Mình sẽ cắt chuỗi sinh ra thành 6 ký tự cho đúng chuẩn hệ Hex trong HTML & CSS.
Bài viết dài nhưng tóm gọn lại chỉ vậy thôi. Chúc các bạn thành công!
Leave a Reply