Online Html Editor

<!DOCTYPE html> <html> <head> <style> .props { height: 50px; padding: 20px; text-align: center; font-weight: bold; font-size: 20px; background-color: lightgreen; } .first { opacity: 0.3; } .second { opacity: 0.6; } .third { opacity: 1; } </style> </head> <body> <h2> CSS opacity property </h2> <h4> opacity: 0.3 </h4> <div class="props first"> This div has opacity: 0.3 </div> <h4> opacity: 0.6 </h4> <div class="props second"> This div has opacity: 0.6 </div> <h4> opacity: 1 </h4> <div class="props third"> This div has opacity: 1 </div> </body> </html>