Warna RGBA adalah format warna CSS3 yang
diadopsi dari warna RGB dengan menambahkan A yang berarti Alpha.
Sebelum RGBA lahir kita telah mengenal warna RGB (Red Green dan Blue)
dalam dunia digital. Batasan nilai pada setiap elemen warna RGB adalah 0
sampai dengan 255.
Alpha pada RGBA fungsinya sama dengan
Opacity, yaitu digunakan untuk mengatur tingkat transparansi dari warna
RGB yang sudah kita tentukan.
Batasan nilai yang digunakan pada Alpha
adalah 0 sampai dengan 1. Jika kita menggunakan nilai 1 pada Alpha maka
akan menghasilkan efek transparan 0% alias terlihat jelas, dan
sebaliknya jika menggunakan 0 maka akan menghasilkan efek transparan
100% alias tidak terlihat.
Penggunaan warna RGBA sama seperti CSS
sebelumnya yaitu bisa digunakan untuk semua property CSS yang bisa
diwarnai. Misalnya text, border dan backgound.
Jika menggunakan RGB:
Maka jika menggunakan RGBA:
Penulisan 0.5 pada alpha juga bisa kita ganti dengan .5 saja.
Contoh penerapannya:
<html>
<head>
<title>Mencoba Warna rgba</title>
<style type="text/css">
body
{ font-family:Arial, Helvetica, sans-serif; background:#000; }
.jelas { color:rgba(255, 255, 255, 1);}
.pudar { color:rgba(255, 255, 255, .6); }
.sangatpudar { color:rgba(255, 255, 255, .3); }
.hilang { color:rgba(255, 255, 255, 0); }
</style>
</head>
<body>
<h1 class="jelas">Rikiya-4rihyoshi.blogspot.Com</h1>
<h1 class="pudar">Rikiya-4rihyoshi.blogspot.Com</h1>
<h1 class="sangatpudar">Rikiya-4rihyoshi.blogspot.Com</h1>
<h1 class="hilang">Rikiya-4rihyoshi.blogspot.Com</h1>
</body>
</html>
Maka hasilnya:

ConversionConversion EmoticonEmoticon