Bootstrap 4 Beta 2 - 导航栏:右对齐不折叠

蒂布斯

我正在尝试创建一个导航栏,左侧有一个按钮,两个图标,然后是最右侧的按钮。

我可以通过我找到的一些示例来实现它,但我不希望任何按钮在小屏幕上折叠。

让我想知道我是否真的需要使用导航栏,但这是我在 alpha-6 中工作的代码,在 beta-2 中按钮不会向右伸展,我该如何实现?

<nav class="navbar navbar-default fixed-top">
<div class="row">
    <div class="col">
        <div class="navbar-brand">
            <button type="button" class="btn btn-primary">
                <i class="fa fa-reorder"></i>
            </button>
            <img [src]="source/path" height="25px" /><img [src]="source/path" height="25px" />
        </div>
    </div>
    <div class="col col-auto text-right">
        <span class="logged-in-user">username</span>

        <button class="btn btn-secondary">
            <i class="fa fa-wechat"></i>
        </button>

        <button class="btn btn-secondary">
            <i class="fa fa-address-book"></i>
        </button>

        <button class="btn btn-secondary">
            <i class="fa fa-anchor"></i>
        </button>
    </div>
</div>
</nav>
克雷

使行的宽度为 100%,并将 ml-auto 添加到第二列(而不是 text-right):

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Bootstrap 4-将导航栏项目向右对齐

来自分类Dev

Bootstrap 4导航栏右对齐搜索选项以及注册

来自分类Dev

bootstrap 3.3.7 到 4beta2:带剃刀的导航栏不工作

来自分类Dev

Bootstrap 4 导航栏:右对齐下拉菜单在右侧打开:溢出

来自分类Dev

bootstrap 4 beta 2 slideUp slideDown 下拉菜单

来自分类Dev

如何折叠Bootstrap 4导航栏

来自分类Dev

导航栏折叠切换不会关闭(从 bootstrap v4 beta 切换到 v4 alpha 6 后)

来自分类Dev

Bootstrap 4 Beta 将媒体正文文本与中间对齐

来自分类Dev

Bootstrap导航栏右对齐按钮

来自分类Dev

导航栏中的 bootstrap 4 按钮对齐

来自分类Dev

Bootstrap 4中的堆叠式可折叠导航栏

来自分类Dev

Bootstrap 4响应式导航栏在xs宽度处折叠?

来自分类Dev

使用Bootstrap 4创建2个导航栏

来自分类Dev

Bootstrap 3,如何在导航栏上右对齐按钮?

来自分类Dev

在Bootstrap中,如何将导航栏链接右对齐?

来自分类Dev

Bootstrap-导航栏中的右对齐菜单

来自分类Dev

防止Bootstrap导航栏以多行显示而不折叠为图标

来自分类Dev

bootstrap4在左侧对齐导航栏项目

来自分类Dev

在Bootstrap 4中更正导航栏链接的垂直对齐

来自分类Dev

将 Bootstrap 4 导航栏链接对齐到底部

来自分类Dev

Bootstrap导航栏折叠成2个汉堡菜单

来自分类Dev

无线电和复选框与 bootstrap 4 beta 3 的垂直对齐

来自分类Dev

bootstrap 4 下拉没有右对齐

来自分类Dev

Bootstrap 4 beta npm 依赖与 ng-bootstrap

来自分类Dev

如何在Bootstrap 4中从Bootstrap 3中编写可折叠的导航栏?

来自分类Dev

bootstrap 4导航栏折叠不起作用(使用jQuery-popper-bootstrap

来自分类Dev

导航栏的 Bootstrap 对齐中心折叠项目

来自分类Dev

Bootstrap 4导航栏-在导航链接中折叠,请点击香草JS

来自分类Dev

Bootstrap 4:徽标增加导航栏高度时,垂直对齐导航链接

Related 相关文章

  1. 1

    Bootstrap 4-将导航栏项目向右对齐

  2. 2

    Bootstrap 4导航栏右对齐搜索选项以及注册

  3. 3

    bootstrap 3.3.7 到 4beta2:带剃刀的导航栏不工作

  4. 4

    Bootstrap 4 导航栏:右对齐下拉菜单在右侧打开:溢出

  5. 5

    bootstrap 4 beta 2 slideUp slideDown 下拉菜单

  6. 6

    如何折叠Bootstrap 4导航栏

  7. 7

    导航栏折叠切换不会关闭(从 bootstrap v4 beta 切换到 v4 alpha 6 后)

  8. 8

    Bootstrap 4 Beta 将媒体正文文本与中间对齐

  9. 9

    Bootstrap导航栏右对齐按钮

  10. 10

    导航栏中的 bootstrap 4 按钮对齐

  11. 11

    Bootstrap 4中的堆叠式可折叠导航栏

  12. 12

    Bootstrap 4响应式导航栏在xs宽度处折叠?

  13. 13

    使用Bootstrap 4创建2个导航栏

  14. 14

    Bootstrap 3,如何在导航栏上右对齐按钮?

  15. 15

    在Bootstrap中,如何将导航栏链接右对齐?

  16. 16

    Bootstrap-导航栏中的右对齐菜单

  17. 17

    防止Bootstrap导航栏以多行显示而不折叠为图标

  18. 18

    bootstrap4在左侧对齐导航栏项目

  19. 19

    在Bootstrap 4中更正导航栏链接的垂直对齐

  20. 20

    将 Bootstrap 4 导航栏链接对齐到底部

  21. 21

    Bootstrap导航栏折叠成2个汉堡菜单

  22. 22

    无线电和复选框与 bootstrap 4 beta 3 的垂直对齐

  23. 23

    bootstrap 4 下拉没有右对齐

  24. 24

    Bootstrap 4 beta npm 依赖与 ng-bootstrap

  25. 25

    如何在Bootstrap 4中从Bootstrap 3中编写可折叠的导航栏?

  26. 26

    bootstrap 4导航栏折叠不起作用(使用jQuery-popper-bootstrap

  27. 27

    导航栏的 Bootstrap 对齐中心折叠项目

  28. 28

    Bootstrap 4导航栏-在导航链接中折叠,请点击香草JS

  29. 29

    Bootstrap 4:徽标增加导航栏高度时,垂直对齐导航链接

热门标签

归档