Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
RGBA Color Values in CSS3
The RGBA color value is for Red, Green, Blue and Alpha. The alpha is the color opacity i.e. a number between 0.0 and 1.0. Here, 1.0 would be for full opaque. Here, we can see the difference in opacity created with the Alpha parameter in RGBA.
Syntax
The following is the syntax of the RGBA Color Values −
rgba(red, green, blue, alpha)
Above, the following values are added to the rgba() method.
Red
Set the color as an −
Integer between 0 and 255.
Percentage between 0% and 100%
Green
Set the color as an −
Integer between 0 and 255.
Percentage between 0% and 100%
Blue
Set the color as an −
Integer between 0 and 255.
Percentage between 0% and 100%
Alpha
The alpha is a number for −
Fully transparent: 0.0
No transparency: 1.0
Set the text background color with RGBA
Let us now see an example to set the text background color using the RGBA color values −
Example
<!DOCTYPE html>
<html>
<head>
<style>
#demo1 {background-color:rgba(108,111,35,0.6);}
#demo2 {background-color:rgba(108,111,35,0.5);}
#demo3 {background-color:rgba(108,111,35,0.4);}
#demo4 {background-color:rgba(108,111,35,0.3);}
#demo5 {background-color:rgba(108,111,35,0.2);}
#demo6 {background-color:rgba(108,111,35,0.1);}
</style>
</head>
<body>
<h1>Cricketers</h1>
<p id="demo1">David Warner</p>
<p id="demo2">Steve Smith</p>
<p id="demo3">Mark Waugh</p>
<p id="demo4">Steve Waugh</p>
<p id="demo5">David Johnson</p>
<p id="demo6">Andy Bichel</p>
</body>
</html>
294 Views
