我在navbarBootstrap 3 中有以下内容：
.affix-top{
transition: top 2s ease 2s;
-webkit-transition: top 2s ease 2s;
-moz-transition: top 2s ease 2s;
-o-transition: top 2s ease 2s;
}
.affix {
top: 0px;
width: 100%;
z-index: 999 !important;
padding-top: 90px;
text-align: center;
background-color: #fff;
padding: 12px 0 12px 0;
border-bottom: 3px double rgba(0, 0, 0, 0.1);
box-shadow: 0px 5px 11px 0px rgba(50, 50, 50, 0.08);
}
.affix+.container-fluid {
padding-top: 300px;
}
.navbar {
border: 1px solid transparent;
background: #fff;
border-radius: 10px;
min-height: 0;
}
.navbar-toggle {
position: relative;
float: right;
margin-right: 15px;
padding: 10px 10px;
margin-top: 10.5px;
margin-bottom: 10.5px;
background-color: #848484;
border: 1px solid transparent;
border-radius: 5px;
}
#fh5co-header {
padding: 20px 0 0 0;
}
#fh5co-header nav ul li {
padding: 0;
margin: 0;
list-style: none;
zoom: 1;
display: inline;
text-align: center;<head>
<meta charset="UTF-8">
<title>NavBar Collapse</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel='stylesheet' href='https://intranet.sanmarino.com.co/sm/css/bootstrap.css'>
<link rel='stylesheet' href='https://intranet.sanmarino.com.co/sm/css/style.css'>
<!-- FontAwesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
</head>
<body>
<div id="fh5co-page">
<header id="fh5co-header" role="banner">
<div class="container" style="text-align:center;">
<div class="header-inner">
<a href="index.php"><img src="https://getbootstrap.com/docs/3.3/assets/img/sass-less.png" style="width: 100%; max-width: 580px;"></a>
</div>
</div>
<nav class="navbar affix" data-spy="affix" data-offset-top="165">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<i class="fas fa-bars"></i>
</button>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Page 1 <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Page 1-1</a></li>
<li><a href="#">Page 1-2</a></li>
<li><a href="#">Page 1-3</a></li>
</ul>
</li>
<li><a href="#">Page 2</a></li>
<li><a href="#">Page 3</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><i class="far fa-user"></i> Salir</a></li>
</ul>
</div>
</div>
</nav>
</header>
</div>
<div style="padding: 200px 0;">
Contenido Cool
</div>
<div style="padding: 200px 0;">
Contenido Cool
</div>
<div style="padding: 200px 0;">
Contenido Cool
</div>
</body>
<script src='https://intranet.sanmarino.com.co/sm/js/jquery.min.js'></script>
<script src='https://intranet.sanmarino.com.co/sm/js/bootstrap.min.js'></script>我想从左侧的菜单中将其水平居中（或对齐）。
有些人可能认为我没有尝试太多，但相信我，我已经尝试了几个小时，但我的知识非常基础。我尝试应用该属性display:inline，然后text-align:center. 我还玩过该属性justify-content及其值center，space-around以及space-between.
我通过在 css 中申请非常接近：
.navbar-nav {
float: left;
margin: 0;
left: 50%;
transform: translatex(-50%);
position: relative;
但是您丢失了作为用户图标的注销选项。我可以通过降低百分比来玩，但我认为这不是考虑各种分辨率的正确方法。
使用
navbar-center具有以下属性的类：这样您就不需要删除或移动
navbar-right您提到的课程的图标。你甚至可以用
nav justify-content-center. 您可以在其官方页面上查看有关 Bootstrap 中菜单定位的更多信息尝试添加
margin: auto并display: table像这样：