我想尝试一下类似于那瓦巴上悬挂的adobe的徽标。但是我无法使用引导程序来做到这一点。
有什么想法吗?
HTML:
<div class="navbar navbar-static-top">
<div class="navbar-inner"> <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="index.html"> <img style="height:50px;" src="http://kpv.s3.amazonaws.com/static/img/logo.jpg"></a>
<div class="nav-collapse collapse">
<ul class="nav pull-left">
<li class="active"><a href="index.html" class="scroller">Home</a>
</li>
<li><a href="pricing.html" class="scroller">Pricing</a>
</li>
<li><a href="knowledge.html" class="scroller">FAQ</a>
</li>
</ul>
</div>
检查这个演示
试试这个CSS:
尝试绝对位置。
相对于父div分配位置,绝对给子div位置。
.navbar-inner{
position:relative;
padding-left:70px;
}
.navbar .brand {
position: absolute;
left: 0px;
top: 0px;
width: 50px;
background: #f00;
margin-left: 0px;
padding: 10px;
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句