CSS color
CSS中的color属性用于设置HTML元素的颜色。通常，此属性用于设置元素的背景色或字体颜色。
在CSS中我们使用颜色值来指定颜色。我们还可以将此属性用于边框颜色和其他装饰效果。
我们可以通过以下方式定义元素的颜色：
RGB格式。
RGBA格式。
十六进制表示法。
HSL。
HSLA。
内置颜色。
让我们详细了解上述方式的语法和说明。
RGB格式
RGB格式是"
红色绿色和
蓝色"，用于定义
HTML的颜色元素，只需指定R，G，B的值（范围为0到255）即可。
使用
rgb()指定此格式的颜色值，此属性允许使用三个值，它们可以是百分比或整数（范围从0到255），这就是为什么不建议使用它的原因。
语法
RGBA格式
除了
RGBA 包含
A（字母）（用于指定元素的透明度。 alpha的值在
0.0到1.0 的范围内，其中
0.0 表示完全透明，而
1.0 表示不透明。
语法
十六进制表示法
十六进制可以定义为六位数的颜色表示形式。该符号以
#符号开头，后跟六个字符，范围从
0到F 。以十六进制表示时，前两位代表
红色（RR）颜色值，后两位代表
绿色（GG）颜色值，后两位代表
蓝色（BB）颜色值。
以十六进制表示的黑色符号为#000000，以十六进制表示的白色符号为#FFFFFF。十六进制表示法的一些代码是#FF0000，#00FF00，#0000FF，#FFFF00等。
语法
color:#(0-F)(0-F)(0-F)(0-F)(0-F)(0-F);
短十六进制代码
它是十六进制表示法的一种缩写形式，其中的每个数字都被重新创建以得出等效的十六进制值。
例如，#7B6变成十六进制的#77BB66。
短十六进制中的黑色符号为#000，短十六进制中的白色符号为#FFF。一些简短的十六进制代码是#F00，#0F0，#0FF，#FF0等。
HSL
色调，饱和度和
亮度。让我们分别了解它们。
色调：可以将其定义为色轮上从0到360的度。0代表红色，120代表绿色，240代表蓝色。
饱和度：：采用百分比表示的值，其中100％表示完全饱和，即没有灰色阴影，50％表示50％灰色，但是颜色仍然可见，并且0％表示完全不饱和，即完全灰色，并且颜色不可见。
亮度：颜色的亮度可以定义为我们要提供的颜色。颜色，其中0％表示黑色（不亮），50％既不表示深色也不亮，而100％表示白色（完全亮度）。
让我们在颜色属性中了解HSL的语法。
语法
HSLA
它与HSL属性完全相似，不同之处在于它包含用于指定元素透明度的
A（alpha）。 alpha的值在
0.0到1.0 的范围内，其中
0.0 表示完全透明，而
1.0 表示不透明。
语法
内置颜色
顾名思义，内置颜色表示以前定义的颜色的集合，这些颜色通过使用红色，蓝色，绿色等名称来使用等等。
语法
让我们看看内置颜色的列表以及它们的十进制和十六进制值。
| S.no。 |
颜色名称 |
十六进制值 |
十进制值或rgb（）值 |
| 1。 |
Red |
#FF0000 |
rgb（255,0,0） |
| 2。 |
Orange |
#FFA500 |
rgb（255,165,0） |
| 3。 |
Yellow |
#FFFF00 |
rgb（255,255,0） |
| 4。 |
Pink |
#FFC0CB |
rgb（255,192,203） |
| 5。 |
Green |
#008000 |
rgb（0,128,0） |
| 6。 |
Violet |
#EE82EE |
rgb（238,130,238） |
| 7。 |
Blue |
#0000FF |
rgb（0,0,255） |
| 8。 |
Aqua |
#00FFFF |
rgb（0,255,255） |
| 9。 |
Brown |
#A52A2A |
rgb（165,42,42） |
| 10。 |
White |
#FFFFFF |
rgb（255,255,255） |
| 11。 |
Gray |
#808080 |
rgb（128,128,128） |
| 12。 |
Black |
#000000 |
rgb（0,0,0） |
下面给出了包括上述属性的CSS颜色的图示。
示例
<html>
<head>
<title>CSS hsl color property</title>
<style>
h1{
text-align:center;
}
#rgb{
color:rgb(255,0,0);
}
#rgba{
color:rgba(255,0,0,0.5);
}
#hex{
color:#EE82EE;
}
#short{
color: #E8E;
}
#hsl{
color:hsl(0,50%,50%);
}
#hsla{
color:hsla(0,50%,50%,0.5);
}
#built{
color:green;
}
</style>
</head>
<body>
<h1 id="rgb">
Hello World. This is RGB format.
</h1>
<h1 id="rgba">
Hello World. This is RGBA format.
</h1>
<h1 id="hex">
Hello World. This is Hexadecimal format.
</h1>
<h1 id="short">
Hello World. This is Short-hexadecimal format.
</h1>
<h1 id="hsl">
Hello World. This is HSL format.
</h1>
<h1 id="hsla">
Hello World. This is HSLA format.
</h1>
<h1 id="built">
Hello World. This is Built-in color format.
</h1>
</body>
</html>
