【发布时间】：2020-06-09 23:11:03
【问题描述】：
(导航栏原来是这样的)我在做一个网站，我用bootstrap创建了一个导航栏，如果我想保持导航栏的宽度和以前一样，我该如何对齐整个导航栏中心？？我试过 align center 和 text-center 但它们不起作用...
<div class="container-fluid menu">
<nav class="navbar navbar-expand-lg navbar-light my-navbar">
<a class="navbar-brand" href="#">
<img src="./assets/logo.png" alt="" loading="lazy">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">About Us</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Eastern Europe
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="#">Croatia</a>
<a class="dropdown-item" href="#">Crezh</a>
</div>
</li>
</ul>
</div>
</nav>
</div>
这是我的 HTML 代码
/*menu bar style*/
.menu{
width:100%;
position: relative;
color: black;
}
.my-navbar{
position: absolute;
z-index:999;
width: 90vw;
height: 10vh;
padding: 20px 20px 20px 20px;
background-color: white;
top:20px;
box-shadow:0px 4px 15px rgba(0,0,0,0.4);
z-index:999;
}
.navbar-brand img{
position: relative;
width: 10vw;
height: 15vh;
margin: 0;
float: none;
}
这是我的css代码
【问题讨论】：
-
导航栏以前的样子如何？
-
尝试使用
标签