HTML CSS examples for CSS Widget:Footer
Report header, page header and page footer
<html> <head> <style> @page {<!-- ww w. ja v a2s . c om--> margin:0px; } @page :first { margin-top:100px; } body { margin:100px 21px 51px 21px; } #headerA { position:fixed; left:0px; right:0px; top:0px; text-align:center; background-color:Chartreuse; height:91px; } #headerB { position:absolute; left:-21px; right:-21px; top:-201px; text-align:center; background-color:yellow; height:191px; } #footer { position:fixed; left:0px; right:0px; bottom:0px; text-align:center; background-color:blue; height:41px; } </style> </head> <body> <div id="headerA"> <h1>Lorem ipsum dol</h1> </div> <div id="headerB"> <img class="logo" src="https://www.java2s.com/style/demo/Firefox.png" height="100" width="500"> <h1>Lorem ipsum dol</h1> </div> <div id="footer"> <p>Lorem ipsum dolor sit amet, consectetur adi</p> </div> <div id="content"> Lorem </div> </body> </html>