Bootstrap导航菜单问题

-1

我是Bootstrap的新手，我只是通过阅读在线教程和文档来探索它。我只是想创建一个小POC来理解它。Bootstrap导航菜单问题

首先问

请看看我的截图：

enter image description here

正如你所看到的，在链接的弹出菜单对准左侧。有没有办法让这个弹出右边？我试图把拉右班，但无济于事。

我创建了一个fiddle

 <ul class="nav navbar-nav navbar-right"> 
     <li class="active"><a href="#">Home</a></li> 
     <li class="dropdown"> 
     <a href="#" class="dropdown-toggle" data-toggle="dropdown">Link<span class="caret"></span></a> 
     <ul class="dropdown-menu" role="menu"> 
      <li><a href="#">Action</a></li> 
      <li><a href="#">Another action</a></li> 
      <li><a href="#">Something else here</a></li> 
      <li class="divider"></li> 
      <li><a href="#">Separated link</a></li> 
      <li class="divider"></li> 
      <

第二个问题

我从我的读数引导不支持，因为可用性问题多层次的下拉菜单看到。我只是想如何解决此，假设我有一个顶层部门链接

+ Departments 
    - Finance 
    - Billing 
    - Accounting 
    - Engineering 
    - IT 
    - General Service

我想缩进结算/财务/ IT /一般事务和被点击保持金融和工程部门。我看到一些能够支持多级下拉的解决方法，但由于它是bootstrap建议，因此我尽可能多地遵循它。有什么想法吗？

来源

2014-09-26 Mark Estrada

嗨，马克。克里斯蒂娜在任何帮助下的冗长答案？它似乎仍然没有回应。 – halfer 2017-09-18 10:39:32

（遗憾的是，downvoted - 见上面，请愿意回复并在这里互动 - 我们依靠善意和游戏化来保持答案滚动。感谢您考虑此事）。 – halfer 2017-10-04 14:34:13

首先，您需要查看构建在Bootstrap 3.x上的多级单击菜单。这里有一个http://jsbin.com/pavopa/1/edit，我从Bootply复制过来。它需要CSS工作。你可能会发现其他人已经完成了。不要使用悬停或涉及悬停的解决方案。屏幕尺寸并不意味着它是一个移动设备。

如果您使用的是navbar-right，则下拉菜单在右侧对齐，而弹出对面，如果您使用navbar-left下拉菜单，则左侧对齐。因此，改变这将涉及进入Bootstrap CSS并在其发生的最小宽度中进行调整。这也不是一个好主意，因为最后一个项目和其他项目，取决于宽度，可能会关闭屏幕，人们将无法使用它。

引导程序的组件不会自动检测视口的边缘，大多数菜单系统都不会。

的引导，导航功能，与几乎所有的点击导航系统的方法：要显示为下拉，不能在同一时间，除非你的链接和切换

+ Departments : this is NOT a link 
    + Finance : this NOT a link 
    - Billing 
    - Accounting

什么违背正常的用户体验，并使文本成为链接，箭头切换。

如果你有“财经”部分信息，使你的第一个网页，如：

+ Departments : Not a link 
    + Finance : Not a link 
    - Finance Overview 
    - Billing 
    - Accounting

来源

2014-09-26 13:41:08 Christina

Bootstrap导航菜单问题

回答

相关问题