Bài 5: Tìm hiểu về color trong CSS

Các bạn có thể thiết lập màu cho màu nền (background) hay màu cho đường viền (border) hay màu cho chữ (text) hay màu cho đường khung của bảng (table)….

Loại màu

Để sử dụng màu trong CSS chúng ta có thể sử dụng tên màu (color name) hoặc giá trị RGB, Hex, HSL, RGBA, HSLA. Mình sẽ đi qua chi tiết từng cái một

    • Tên màu: Red, Blue, Black, Yellow, Green, … nhưng vẫn bị hạn chế về màu, nên dùng khi bạn làm web bình thường và không yêu cầu đa dạng về màu sắc.
    • Mã RGB: bộ ba giá trị đó là đỏ (red), xanh lá cây (green), xanh da trời (blue). Bạn có thể xác định mã này bằng cách screenshot màn hình, mở paint và dùng color picker để xem mã màu RGB

  • Mã Hex: Là mã có dấu # trước mỗi màu, ví dụ màu trắng là mã #FFFFFF, có thể viết thành #FFF hoặc màu đen #000000 vó thể viết thành #000, các màu khác phải đủ 6 chữ số.

Bên trên chỉ là các mã màu cơ bản nhất, khu dùng nhiều bạn sẽ nhớ các mã màu ngay. Còn các loại màu khác nhưng theo mình thì mã RGB là quá đủ và tốt nhất, dễ tìm nhất.

Sử dụng

1. Theo Tên Màu

p{
color: red;
}

2. Theo mã màu RGB

p{
color: rgb(255,255,255);
}

3. Theo mã HEX

p{
color: #000000;
}

Ngoài ra khi bạn tạo màu nền, muốn cho nền trong suốt bạn có thể dùng bộ mã RGBA

p{
color: rgba(255,255,255,0.5);
}

Số 0.5 cuối chính là độ trong suốt của màu.

Chia sẻ bài viết

Bài 5: Tìm hiểu về color trong CSS

Hoặc copy địa chỉ

Nội dung

Bài 5: Cách tạo comment trong Python

Bài 4: Cách khai báo biến trong Python

Bài 3: Cài đặt Intellij IDEA và chạy Hello World trong Python

Bài 2: Hướng dẫn download và cài đặt python trên Windows

Bài 5: Tìm hiểu về Props trong ReactJS

Bài 4: Components trong ReactJS

Bài 3: Giới thiệu JSX trong ReactJS

Bài 2: Cài đặt môi trường chạy ReactJS

Bài 18: Thuộc tính icon trong CSS

Các biểu tượng có thể dễ dàng được thêm vào trang HTML của b...

Bài 17: Thuộc tính box model trong CSS

Bài 16: Thuộc tính outline trong CSS

Bài 15: Thuộc tính Height/Width trong CSS

Chat Icon Close Icon