HTML CSS examples for CSS Widget:Image Text
Text appearing under image
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> * {<!-- w w w. j a v a 2s . c o m--> padding:0; margin:0 auto; } .img { z-index:3; width:100%; height:100%; background-image:url('https://www.java2s.com/style/demo/Google-Chrome.png'); position:fixed; } h1 { position:relative; z-index:2; } body { z-index:100; overflow:hidden; width:100%; height:100%; } </style> </head> <body> <div class="img"> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> </div> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> <h1>Lore</h1> </body> </html>