[英]Logo overlap in bootstrap twitter navbar
我想让我的徽标与导航栏重叠,但是我不知道如何。 我试图增加图片的大小,但没有成功,导航栏只是放大了。 我也希望它在同一个div类中,因为否则它在网站的移动版本上不会很好。 我将添加有关其外观,所需内容和代码的图片。 提前致谢
代码: <!-- Navigation --> <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <div class="container"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <img style="max-width:80px; margin-top:0px;" src="img/logo.png" class="logo navbar-brand"> <a class="navbar-brand" rel="home" href="index.html"><b>MY WEBSITE</b></a> </div>
<!-- Navigation --> <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <div class="container"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <img style="max-width:80px; margin-top:0px;" src="img/logo.png" class="logo navbar-brand"> <a class="navbar-brand" rel="home" href="index.html"><b>MY WEBSITE</b></a> </div>
给您的徽标添加“徽标”类,然后添加:
.logo {
position: fixed;
top: 1em;
left: 1em;
display: inline;
}
修复您的导航栏。
希望有帮助!
只需将徽标放在导航栏div之外即可。 并将其顶部对齐:0px,左侧对齐:0px。
或者,如果您希望徽标始终在左侧,则只需将其向左浮动即可。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.