Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/41.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Css Bootstrap 4 Beta 2导航条品牌定位_Css_Angular_Bootstrap 4_Angular5 - Fatal编程技术网

Css Bootstrap 4 Beta 2导航条品牌定位

Css Bootstrap 4 Beta 2导航条品牌定位,css,angular,bootstrap-4,angular5,Css,Angular,Bootstrap 4,Angular5,这与这个问题非常相似:这个问题似乎没有解决 我将我的应用程序从Angular 4移动到Angular 5,在“npm更新”的过程中,我移动到了“bootstrap”:“4.0.0-beta.2”,NavBar品牌现在是右对齐的。不管屏幕有多宽,项目都会被折叠 来解决这个问题。我确实做了ng新的导航应用程序。因此,创建了全新的应用程序 然后,如本文所述,我安装了Bootstrap、Jquery和Popper: 以下是我的angular-cli.json: "styles": [

这与这个问题非常相似:这个问题似乎没有解决

我将我的应用程序从Angular 4移动到Angular 5,在“npm更新”的过程中,我移动到了“bootstrap”:“4.0.0-beta.2”,NavBar品牌现在是右对齐的。不管屏幕有多宽,项目都会被折叠

来解决这个问题。我确实做了
ng新的导航应用程序
。因此,创建了全新的应用程序

然后,如本文所述,我安装了Bootstrap、Jquery和Popper:

以下是我的angular-cli.json:

      "styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.min.css",
    "styles.css"
  ],
  "scripts": [
    "../node_modules/jquery/jquery.min.js",
    "../node_modules/popper.js/dist/umd/popper.min.js",
    "../node_modules/bootstrap/dist/js/bootstrap.bundle.js"
  ],
我将导航条示例放在官方引导网站中:放入app.component.html

<nav class="navbar navbar-toggleable-md navbar-dark bg-dark">
      <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <a class="navbar-brand" href="#">Navbar</a>

      <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto">
          <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="#">Link</a>
          </li>
          <li class="nav-item">
            <a class="nav-link disabled" href="#">Disabled</a>
          </li>
        </ul>
      </div>
    </nav>

结果如下所示: 1.切换(汉堡图标)在我点击它时起作用。但位置是相反的,无论浏览器窗口有多宽,汉堡图标都不会展开

  • 我认为bootstrap.css肯定工作得很好,因为我制作了一个按钮,它有正确的引导颜色 问题:我如何控制汉堡图标何时出现?(当屏幕较宽时,导航项目应显示为不带汉堡图标。) 有人能解释一下Beta引导发生了什么吗?我的代码用于使用以前版本的引导,包括4 Alpha


    当屏幕宽度足以显示所有导航项目时,我的生产代码导航栏将正确显示所有导航项目。它在正确的时间崩溃了。我想弄清楚这是一个角度5的问题,还是Boostrap决定从4 Alpha改为4 Beta,并决定改变css类的位置

    您缺少的是
    导航栏扩展-*

    尝试添加
    导航栏展开lg

    文件如下:

    alpha版本已经过时了,真是无可救药


    p.S.Bootstrap 4 beta 3是Bootstrap 4的最新版本。下一个版本将是Bootstrap 4 final。

    您真正想要的是什么???@WebDevBooster在我的导航栏中重新创建第一个示例已折叠,位置与示例不同。我的陷阱是在谷歌上搜索“Bootstrap 4 beta导航栏”,前两个链接是最新的。谢谢你的基本假设是正确的
    navbar toggleable-*
    类在最新的Bootstrap 4版本中不再存在。如果您不介意,请将我的答案标记为“正确”。如果您使用google Bootstrap 4,我非常确定每个链接都会将您指向它的alpha版本。我总是要点击页面顶部才能进入测试版文档(或将其添加到书签)。