相关疑难解决方法(0)

在bootstrap 4中禁用响应式导航栏

有没有办法在bootstrap 4中禁用响应式navBar?我不希望移动版本中的下拉菜单仍然可以看到该品牌旁边的2个链接.作为一个加号,我想知道是否可以将链接放在栏中的右侧.Pull-xs-right似乎无法正常工作.

我当前的代码如下所示:

<nav class="navbar navbar-fixed-top navbar-toggleable-sm navbar-light bg-faded">
    <a href="/" class="navbar-brand">PIM</a>
    <ul class="nav navbar-nav pull-xs-right">
        <li class="nav-item"><Link class="nav-link" to="/login">Login</Link></li>
        <li class="nav-item"><Link class="nav-link" to="/signup">Sign up</Link></li>
    </ul>
</nav>
Run Code Online (Sandbox Code Playgroud)

首先十分感谢.

navbar twitter-bootstrap twitter-bootstrap-4 bootstrap-4

8
推荐指数
1
解决办法
1万
查看次数

调整屏幕大小时,bootstrap 4导航栏消失

我使用angular 2和bootstrap 4,navbar主页上有一个,但是当我将页面缩小到小于1000px时,文本就navbar消失了.

这是我的代码:

 <nav class="navbar navbar-expand-lg navbar-dark bg-info" style="padding: 1px; width: 100%">
    <!-- <a class="navbar-brand" routerLink='/index' style="padding-right: 5px">
    </a> -->
    <div class="navbar-inner">
      <div class="container">

        <!-- .btn-navbar is used as the toggle for collapsed navbar content -->
        <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>
        <!-- Be sure to leave the brand out there if you want it shown -->
        <!-- <a class="brand" href="#">Project name</a> -->

        <div class="collapse navbar-collapse" >
          <div class="navbar-nav …
Run Code Online (Sandbox Code Playgroud)

html bootstrap-4 angular

4
推荐指数
1
解决办法
3333
查看次数

Bootstrap 4 固定顶部导航栏显示折叠并隐藏内容

我已经尝试过很多线程对SO,也这一个,但不能把它做。我正在尝试使用 bootstrap 4 在顶部制作一个固定的导航栏。但看起来导航栏正在向顶部移动。我也尝试css按照官方文档的建议添加填充,但内容不是固定的导航栏。这是默认的导航栏图像 在此处输入图片说明

这是我得到的固定导航栏图像 在此处输入图片说明 我不知道我在这方面缺少什么。这是代码

<nav class="navbar fixed-top navbar-light bg-light">
        <div class="collapse navbar-collapse" id="navbarNav">
            <ul class="navbar-nav">
                <li class="nav-item-active">
                    <a class="nav-link" href="#/">Home<span class="sr-only">(current)</span></a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#/product">Products</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#/services">Services</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#/career">Career</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#/contact">Contact Us</a>
                </li>
            </ul>
        </div>
    </nav>
Run Code Online (Sandbox Code Playgroud)

有什么帮助吗?

html css twitter-bootstrap bootstrap-4

1
推荐指数
1
解决办法
5593
查看次数