The HTML Document , Named OpacityLevelonElement.html to show the color effects using CSS code.
CSS File Named: Opacitycolorlevel.css
h1{color:red;
background-color:green;opacity:0.3;
}
h2{
color:red;
background-color:green;opacity:0.6;
}
h3{
color:red;
background-color:green;opacity:1.0;
}
The text color of h1, h2, and h3 elements is set to red , while the background of these elements is displayed with different opacity levels.
HTML File Named:OpacityLevelonElement.html
<!doctype html>
<head>
<title>CSS colors web page</title>
<link rel="stylesheet" type="text/css" href="Opacitycolorlevel.css">
</head>
<body>
<h1>Heading Tag first opacity level first </h1>
<h2>Heading Tag second opacity level second </h2>
<h3>Heading Tag third opacity level third</h3>
</body>
</html>
The Browser view of the Opacity level on element document:
CSS File Named: Opacitycolorlevel.css
h1{color:red;
background-color:green;opacity:0.3;
}
h2{
color:red;
background-color:green;opacity:0.6;
}
h3{
color:red;
background-color:green;opacity:1.0;
}
The text color of h1, h2, and h3 elements is set to red , while the background of these elements is displayed with different opacity levels.
HTML File Named:OpacityLevelonElement.html
<!doctype html>
<head>
<title>CSS colors web page</title>
<link rel="stylesheet" type="text/css" href="Opacitycolorlevel.css">
</head>
<body>
<h1>Heading Tag first opacity level first </h1>
<h2>Heading Tag second opacity level second </h2>
<h3>Heading Tag third opacity level third</h3>
</body>
</html>
The Browser view of the Opacity level on element document:
No comments:
Post a Comment