HTML CSS examples for CSS Widget:Image Text
Use img tag inside a div as the divs background image with text over
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .article {<!--from w ww .j av a2 s . co m--> height:181px; padding:11px; background-color:Chartreuse; overflow:hidden; } .article img { position:absolute; z-index:0; height:201px; margin:-11px; } .article h1,.article h2 { position:relative; z-index:2; } </style> </head> <body> <div class="article"> <img src="https://www.java2s.com/style/demo/InternetExplorer.png" class="article-bg"> <h1 class="heading">Lorem ipsum dol</h1> <h2 class="author">Lorem ipsum</h2> </div> </body> </html>