HTML CSS examples for CSS Widget:Image Text
create a dark transparent overlay on the image with text on it
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <!--from w w w. jav a 2 s . co m--> <body> <p>Lorem ipsum dolor sit amet, consectetur</p> <div class="container"> <img src="https://www.java2s.com/style/demo/Safari.png" alt="Avatar" class="image" style="width:100%"> <div class="middle"> <div class="text-wrapper"> <div class="text"> Lorem ipsu </div> </div> </div> </div> </body> </html>