@ CSS

rgba()

RGBAカラーモデルは、RGBカラーモデルのred・green・blueに、alphaを追加して透明度を指定できるように拡張したものです。

a は透明度(アルファ値)を意味し、 0 = 透明(transparent)、1 = 不透明(opaque)を表します。

format

/* RGB */
rgb(255,255,0);
rgb(100%,100%,0%);
  
/* RGBA */
rgba(255,255,0,0.3);
rgba(100%,100%,0%,0.7);
  

property_color_rgba

<style>
.color0 { background-color: rgb(255,255,0); }
.color10 { background-color: rgba(255,255,0,1); }
.color9 { background-color: rgba(255,255,0,0.9); }
.color8 { background-color: rgba(255,255,0,0.8); }
.color7 { background-color: rgba(255,255,0,0.7); }
.color6 { background-color: rgba(255,255,0,0.6); }
.color5 { background-color: rgba(255,255,0,0.5); }
.color4 { background-color: rgba(255,255,0,0.4); }
.color3 { background-color: rgba(255,255,0,0.3); }
.color2 { background-color: rgba(255,255,0,0.2); }
.color1 { background-color: rgba(255,255,0,0.1); }
</style>

<div class="color0">rgb(255,255,0)</div>
<div class="color10">rgba(255,255,0,1)</div>
<div class="color9">rgba(255,255,0,0.9)</div>
<div class="color8">rgba(255,255,0,0.8)</div>
<div class="color7">rgba(255,255,0,0.7)</div>
<div class="color6">rgba(255,255,0,0.6)</div>
<div class="color5">rgba(255,255,0,0.5)</div>
<div class="color4">rgba(255,255,0,0.4)</div>
<div class="color3">rgba(255,255,0,0.3)</div>
<div class="color2">rgba(255,255,0,0.2)</div>
<div class="color1">rgba(255,255,0,0.1)</div>

demo