<hex-color>
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.
CSS 数据类型 <hex-color> 为描述 sRGB 颜色的十六进制颜色语法的记号,此记号将颜色的主分量(红、绿、蓝)及其透明度写为十六进制数。
在可使用 <color> 的任意位置均可使用 <hex-color> 值。
语法
#RGB // 三值语法 #RGBA // 四值语法 #RRGGBB // 六值语法 #RRGGBBAA // 八值语法
取值
R或RR-
颜色的红色分量,为介于
0和ff(255)之间不区分大小写的十六进制数。若仅有一数,则重复此数——1意为11。 G或GG-
颜色的绿色分量,为介于
0和ff(255)之间不区分大小写的十六进制数。若仅有一数,则重复此数——c意为cc。 B或BB-
颜色的蓝色分量,为介于
0和ff(255)之间不区分大小写的十六进制数。若仅有一数,则重复此数——9意为99。 A或AA可选-
颜色的 alpha 分量,标示其透明度,为介于
0和ff(255)之间不区分大小写的十六进制数。若仅有一数,则重复此数——e意为ee。0(即00)表示完全透明的颜色,而f(即ff)表示完全不透明的颜色。
备注:
此语法不区分大小写——#00ff00 与 #00FF00 相同。
示例
>完全不透明的亮粉色的十六进制语法
HTML
html
<span>
#f09
<div class="c1"></div>
</span>
<span>
#F09
<div class="c2"></div>
</span>
<span>
#ff0099
<div class="c3"></div>
</span>
<span>
#FF0099
<div class="c4"></div>
</span>
CSS
css
div {
width: 40px;
height: 40px;
}
.c1 {
background: #f09;
}
.c2 {
background: #f09;
}
.c3 {
background: #ff0099;
}
.c4 {
background: #ff0099;
}
结果
规范
| Specification |
|---|
| CSS Color Module Level 4> # hex-notation> |
浏览器兼容性
Loading…