HTML本身不定义透明色，所谓“透明颜色代码”其实是CSS支持的带Alpha通道的颜色表示法；必须用rgba()、hsla()或opacity属性实现透明效果，其中rgba()和hsla()通过第4参数（0–1）控制颜色透明度，opacity则使整个元素及子内容统一变透明。
HTML里没有“透明颜色代码”这回事，只有RGBA、HSLA或opacity控制透明度
直接说结论：HTML本身不定义透明色，所谓“透明颜色代码”其实是CSS支持的带Alpha通道的颜色表示法。用#RRGGBB十六进制写法永远不透明；要调透明度，必须用rgba()、hsla()或opacity属性。
rgba()中第4个参数就是0–1的透明度，0=全透明，1=不透明
这是最常用也最直观的方式，尤其适合单个元素局部着色（比如按钮背景、文字阴影）：
-
rgba(255, 0, 0, 0.5)是半透明红色，alpha=0.5 -
rgba(0, 0, 0, 0)是完全透明的黑色——实际就是看不见 -
rgba(0, 0, 0, 1)等价于#000或black - alpha值小于0或大于1会被截断为0或1，浏览器不会报错但无效
- 注意：IE8及更早版本不支持
rgba()，需提供降级色（如先写background-color: #000;，再覆盖background-color: rgba(0,0,0,0.3);）
opacity影响整个元素及其所有子内容，和rgba有本质区别
opacity是CSS属性，不是颜色值。它会让元素自身+所有子节点（文字、子div、图片）一起变透明，无法单独控制某一部分：
div {
background-color: #333;
color: white;
opacity: 0.7;
}
上面这段会让灰色背景、白色文字、以及里面所有嵌套内容都变成70%不透明。如果只想让背景透而文字不透，就必须用rgba()设背景色，而不是opacity。
立即学习“前端免费学习笔记（深入）”；
HSLA和RGBA逻辑一致，但用色相/饱和度/亮度描述颜色
如果你习惯用HSL调色（比如设计师常用），hsla()同样支持第4个alpha参数：
-
hsla(120, 100%, 50%, 0.8)是80%不透明的纯绿色 -
hsla(0, 0%, 100%, 0)是完全透明的白色（但视觉上就是空） - 和
rgba()一样，alpha超出[0,1]范围会被强制约束 - 兼容性与
rgba()基本一致，现代浏览器全支持，IE9+可用
真正容易被忽略的是：透明度数值本身没有单位，也不是百分比——0.3就是30%不透明（即70%透明），别写成30%或30，那样会失效。
