更改导航栏品牌的位置

时间:2019-03-31 17:59:31

标签: html bootstrap-4

我想将navbar-brand移到右边。默认位置与另一个按钮有点重叠。我该怎么做? 这是我的html代码:

<nav class="navbar navbar-expand-lg navbar-light bg-light">
                <div class="container-fluid">
                    <button type="button" id="sidebarCollapse" class="navbar-btn">
                        <span></span>
                        <span></span>
                        <span></sp<an>
                    </button>
                    <a class="navbar-brand" href="#" >Agora</a>
                    <div class="collapse navbar-collapse" id="navbarSupportedContent">
                        <form class="form-inline mx-auto my-2">
                            <input class="form-control mr-sm-1" type="search" placeholder="Search" aria-label="Search">
                            <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
                        </form>


我必须使用CSS吗? 代码是公认的:)

2 个答案:

答案 0 :(得分:1)

我知道您想从他当前的位置开始对按钮进行一些下注

您可以看到此示例here

因此您可以像往常一样将引导定位类与navbar-brand一起使用

ml-*, mr-*

答案 1 :(得分:0)

将此添加到CSS文件中。

.navbar-brand
{
  position: absolute;
  width: 100%;
  left: 0;
  text-align: right;
  margin: auto;
}

您可以查看正在运行的演示here。位置在演示中为center,将位置调整为right或任何您喜欢的位置。