Màu đường viền CSS
Màu đường viền CSS
Thuộc tính outline-color
được sử dụng để đặt màu cho đường viền.
Màu sắc có thể được thiết lập bằng cách:
- tên - chỉ định tên màu, như "đỏ"
- HEX - chỉ định giá trị hex, như "#ff0000"
- RGB - chỉ định giá trị RGB, như "rgb(255,0,0)"
- HSL - chỉ định giá trị HSL, như "hsl(0, 100%, 50%)"
- đảo ngược - thực hiện đảo ngược màu (đảm bảo rằng đường viền có thể nhìn thấy được, bất kể màu nền)
Ví dụ sau đây cho thấy một số đường viền khác nhau với các màu khác nhau. Cũng lưu ý rằng các phần tử này cũng có viền đen mỏng bên trong đường viền:
Một đường viền màu đỏ rắn.
Một đường viền chấm màu xanh.
Một phác thảo màu xám ban đầu.
Ví dụ
p.ex1
{
border: 2px solid black;
outline-style: solid;
outline-color: red;
}
p.ex2
{
border: 2px solid black;
outline-style: dotted;
outline-color: blue;
}
p.ex3
{
border: 2px solid black;
outline-style: outset;
outline-color: grey;
}
Hãy tự mình thử »Giá trị HEX
Màu đường viền cũng có thể được chỉ định bằng giá trị thập lục phân (HEX):
Giá trị RGB
Hoặc bằng cách sử dụng các giá trị RGB:
Giá trị HSL
Bạn cũng có thể sử dụng các giá trị HSL:
Bạn có thể tìm hiểu thêm về các giá trị HEX, RGB và HSL trong các chương Màu CSS của chúng tôi.