HTML CSS examples for CSS Widget:Menu Bar
Title and menu bar
<html lang="en"> <head> <style> .banner .container {<!--from www . j ava2 s . c o m--> background:Chartreuse; width:cover; height:51px; margin:-11px -31px 0 -21px; } .banner .strip { background:yellow; height:6px; width:cover; } body { text-align:center; } .logo { font:; color:blue; background:url('https://www.java2s.com/style/demo/Google-Chrome.png'); margin-top:151px; margin-bottom:81px; height:21px; } h1 { font-size:61px; font-family:'Niconne', cursive; } ul { background:pink; padding:3px 0 3px 0; width:100%; overflow:hidden; list-style:none; } li { font-size:26px; font-family:'Londrina Solid', cursive; border:2px solid OrangeRed; width:17.6%; float:left; } </style> </head> <body translate="no"> <div class="banner"> <div class="container"> </div> <div class="strip"> </div> </div> <div class="logo"> <h1>Lorem ipsum dolo</h1> </div> <div class="menu"> <div class="container"> <ul> <li> <a href="#">Lore</a> </li> <li> <a href="#">Lore</a> </li> <li> <a href="#">Lorem</a> </li> <li> <a href="#">Lorem </a> </li> <li> <a href="#">Lorem ipsum d</a> </li> <li> <a href="#">Lorem i</a> </li> </ul> </div> </div> </body> </html>