-
-
加入收藏
设为首页
加入收藏
设为首页
CSS颜色
CSS使用颜色值来指定颜色。通常，这些用于设置元素的前景色（即其文本）或元素的背景色。它们还可以用于影响边框和其他装饰效果的颜色。
语法
CSS可以以多种方式设置元素的颜色。让我们检查所有可能的语法来设置元素的高度。
命名颜色
CSS命名颜色是颜色的名称，例如红色、蓝色、黑色或浅海蓝色。
color: blue;
border: 1px solid red;
background: aliceblue;
RGB十六进制颜色
color: #f09;
border: 1px solid #ff0099;
background: #eee;
RGB（红、绿、蓝）颜色
color: rgb(255 0 153);
border: 1px solid rgb(255 0 153);
background: rgb(255 0 153 / 80%);
HSL（色调、饱和度、亮度）颜色
color: hsl(150 30% 60%);
border: 1px solid hsl(150 30% 60%);
background: hsl(150 30% 60% / 0.8);
HWB（色相，白度，黑度）颜色
color: hwb(12 50% 0%);
border: 1px solid hwb(12 50% 0%);
background: hwb(194 0% 0% / 0.5);
LAB（明度、A轴、B轴）颜色
color: lab(50% 40 59.5);
border: 1px solid lab(50% 40 59.5);
background: lab(50% 40 59.5 / 0.5);
轻度、饱和度和色相 (LCH) 色彩
color: lch(52.2% 72.2 50);
border: 1px solid lch(52.2% 72.2 50);
background: lch(52.2% 72.2 50 / 0.5);
OkLab（亮度，A轴，B轴）颜色
color: oklab(59% 0.1 0.1);
border: 1px solid oklab(59% 0.1 0.1);
background: oklab(59% 0.1 0.1 / 0.5);
Oklch（明度，色彩度，色相）颜色
color: oklch(60% 0.15 50);
border: 1px solid oklch(60% 0.15 50);
background: oklch(60% 0.15 50 / 0.5);
CSS颜色-关键字
CSS支持直接将颜色名称传递给属性背景颜色（background-color）和文字颜色（color）。CSS支持140种标准颜色名称。
下面是一个示例：
<html>
<head>
<style>
div {
background-color: aqua;
padding: 10px;
}
</style>
</head>
<body>
<h3>Color Keyword - example</h3>
<p>As the keyword passed is aqua, the background will appear as aqua colored..</p>
<div>
This div element has a colored background based on the color keyword passed, i.e aqua.
</div>
</body>
</html>
作者QQ及微信：49922779 
