css - How to add logo and the menu on the image in html -
i'm developing website contain logo , menu. case want add together items on top of page , on slider first image. logo transparent image. want display slider image background of slider sec image.
i used bootstrap 3 here.
this construction of html.
<body> <header> <div class="row"> <div class="col-md-2"> //logo image </div> <div class="col-md-3""> <nav class="navbar navbar-default" role="navigation"></nav> </div> </div> </header> <div class="row"> <div class="container-fluid"> //slider </div> </div> </body>
css
logo css -
.banner-img { overflow: visible; z-index: 10000; float: left; position: absolute; }
menu css -
.menu { background: #f7f6f0; padding: 0; float: right; width: 100%; }
image 01
can help me solve problem?
html
<div id="logo"> <img src="http://skymaiden.com/placeholder.php" alt="" /> </div> <nav>menu</nav> <div id="slider"></div>
css
#logo { position:absolute; z-index-999; top:0; left:0; } nav { width:100%; height:35px; line-height:35px; background:green; color:#ffffff; font-weight:bold; text-align:right; } #slider { width:100%; height:200px; background:pink; }
fiddle demo
html css twitter-bootstrap
No comments:
Post a Comment