Twitter的导航栏更改时,屏幕大小
问题描述:
请看看这三种图像的高度:如果所有元素融入导航栏everithingTwitter的导航栏更改时,屏幕大小
1)是确定
2)如果只有核心要素适合进入导航栏navabar的高度,如果页面自动
3)encrease变得更小的是好的
代码:
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="Default.aspx">Gestione Azienda</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<!--<li class="active"><a href="#">Link</a></li>-->
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Elenco commesse<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a runat="server" href="~/elenco.aspx?societa=1">1</a></li>
<li><a runat="server" href="~/elenco.aspx?societa=2">2</a></li>
<li><a runat="server" href="~/elenco.aspx?societa=3">3</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Gestisci commessa<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a runat="server" href="~/1.aspx/#tab-1">1</a></li>
<li><a runat="server" href="~/2.aspx/#tab-2">2</a></li>
<li><a runat="server" href="~/3.aspx/#tab-3">3</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Impostazioni<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a runat="server" href="~/impostazioni.aspx">Impostazioni Generali</a></li>
<li><a runat="server" href="~/GestioneUtenti.aspx">Gestione utenti</a></li>
</ul>
</li>
<li><a id="A1" runat="server" href="~/ProgLavori.aspx" target="_blank">Programmazione lavori</a></li>
<li><a runat="server" href="http://" target="_blank">Posta</a></li>
<li><a id="menu_logout" runat="server" onserverclick="logout">Logout</a></li>
<li><a id="menu_login" runat="server" href="~/Default.aspx">Login</a></li>
</ul>
</div>
</div>
</nav>
在这里你可以找到的代码,如果你尝试调整菜单区,你可以看到我的问题。
有人能帮助我吗?
我需要启用navbar-collapse,因为它可以适应手机屏幕。禁用它就像那个http://jsfiddle.net/bos09162/。 –