嗨,我在Web应用程序中使用引导程序,但是导航栏有问题,我的代码在这里:

<nav class="navbar navbar-inverse navbar-static-top" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#mainNavBar">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" rel="home" href="/" title="Backoffice Wenco"><img style="max-width:50px; margin-top: -7px;" src="http://www.mekano.com/mkn2009/pics/logos_manufacturas/logo_wenco.gif"></a>
            <span class="navbar-brand">Gestión de Horas</span>
        </div>
        <div class="navbar-collapse collapse" id="mainNavBar">
            <ul class="nav navbar-nav">
                <li>@Html.ActionLink("Inicio", "Index", "Home")</li>
                @if (userAccessService.IsInAction(user.SamAccountName, appId, "Project"))
                {
                    var action = user.ApplicationRoles.First(i => i.Application.Alias.Equals(appId)).Actions.FirstOrDefault(a => a.Controller == "Project");
                    <li>@Html.ActionLink(action.Caption, "Index", "Project")</li>
                }
                @if (userAccessService.IsInAction(user.SamAccountName, appId, "Project", "EditUsers"))
                {
                    var action = user.ApplicationRoles.First(i => i.Application.Alias.Equals(appId)).Actions.FirstOrDefault(a => a.Controller == "Project" && a.Accion == "EditUsers");
                    <li>@Html.ActionLink(action.Caption, "EditUsers", "Project")</li>
                }
                @if (userAccessService.IsInAction(user.SamAccountName, appId, "Report"))
                {
                    var action = user.ApplicationRoles.First(i => i.Application.Alias.Equals(appId)).Actions.FirstOrDefault(a => a.Controller == "Report");
                    <li>@Html.ActionLink(action.Caption, "UserProjectHours", "Report")</li>
                }
                @if (userAccessService.IsInAction(user.SamAccountName, appId, "WorkingDay", "Index"))
                {
                    var action = user.ApplicationRoles.First(i => i.Application.Alias.Equals(appId)).Actions.FirstOrDefault(a => a.Controller == "WorkingDay" && a.Accion == "Index");
                    <li>@Html.ActionLink(action.Caption, "Index", "WorkingDay")</li>
                }
                @if (userAccessService.IsInAction(user.SamAccountName, appId, "WorkingDay", "IndexAdmin"))
                {
                    var action = user.ApplicationRoles.First(i => i.Application.Alias.Equals(appId)).Actions.FirstOrDefault(a => a.Controller == "WorkingDay" && a.Accion == "IndexAdmin");
                    <li>@Html.ActionLink(action.Caption, "Index", "WorkingDay")</li>
                }
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li><p class="navbar-text">@user.GivenName</p></li>
                <li>@Html.ActionLink("Cerrar Sesión", "LogOff", "Account")</li>
            </ul>
        </div>
    </div>
</nav>


我有一个默认的导航栏,还有一个右侧的导航栏,但是合拢效果无法很好地发挥作用,此处捕获:







有谁知道我该怎么做才能避免错误?

更新资料
我想进一步说明我的问题。我想一直将导航栏放在一行,如果元素不能在同一行,它应该显示菜单(就像最后一张图片一样)

最佳答案

问题是您的导航栏中有很多链接...解决方案将是更改“ grid-float-breakpoint” ...默认情况下,对于小屏幕设备它会中断...您需要将其更改为中等屏幕设备...如果您使用sass或更少,您可以像这样更改变量

@ grid-float-breakpoint:@ screen-md-min

检查引导程序的自定义页面,然后查找“ grid-float-breakpoint”

10-05 20:47
查看更多