相关疑难解决方法(0)

在引导,什么是最平台友好的方式来创建一个导航栏,有徽标中的左边,在中心菜单项和标志B上的吧？

这是我到目前为止已经试过,它最终被对齐,使标志A是在左边,菜单项旁边的右边的左边和标志B中的标志.

<div class="navbar navbar-fixed-top navbar-custom ">
  <div class="container" >
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#"><span class="navbar-logo">Logo_A</span></a>
    </div>
    <div class="collapse navbar-collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#about">Menu Item 1</a></li>
        <li><a href="#contact">Menu Item 2</a></li>
        <li><a href="#about">Menu Item 3</a></li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#"><img src="images/Logo_B.png" class="img-responsive"></a></li>
      </ul>
    </div>
  </div>
</div>

我试图将我的导航栏链接放在中心,但是当我做我的品牌标识时,它会向右推,因此它不会居中.继承人我的HTML ...

<nav class="navbar navbar-toggleable-md navbar-light main-nav">
  <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="index.html">Brand Name</a>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mx-auto clearfix">
      <li class="nav-item active">
        <a class="nav-link" href="index.html">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" href="#">Link</a>
      </li>
    </ul>

  </div>
</nav> 

如何阻止品牌标识影响导航栏链接的位置.

如果我想根据Bootstrap 4中浏览器窗口的大小将导航项（链接）放在导航栏中，该怎么办？请看一下代码：

<nav class="navbar navbar-toggleable-md navbar-light bg-faded">
    <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" 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="navbarNavAltMarkup">
        <div class="navbar-nav">
            <a class="nav-item nav-link active" href="#">Home <span class="sr-only">(current)</span></a>
            <a class="nav-item nav-link" href="#">Features</a>
            <a class="nav-item nav-link" href="#">Pricing</a>
            <a class="nav-item nav-link disabled" href="#">Disabled</a>
        </div>
    </div>
</nav>

现在，我想根据浏览器的宽度将div的中心设置为“ navbar-nav”。我尝试过的一件事是给它mr-auto和ml-auto使其确实居中，但不完全准确。实际上，它根据宽度“浏览器窗口宽度-徽标宽度”将其居中。我希望它恰好位于屏幕中间。

我也尝试过将位置更改为绝对位置，但是同样，在折叠模式下，这种布局也会变得混乱。