<分区>
标签 html css bootstrap-4
<分区>
我试图将品牌置于下方导航栏的中心。我尝试更改样式以使文本居中,但我尝试过的任何方法都不起作用。我附上了它现在的样子的照片。我只需要将文本居中而不是在左侧设置格式。
<nav class="navbar fixed-top flex-md-nowrap navbar-expand-sm navbar-dark shadow" style="padding-top: 0; padding-bottom: 0; background-color:var(--theme-gray)">
<a class="navbar-brand" href="#" style="padding: 0;">
<img src="img/Cama-i Ellam Yui Logo - Header, Large.jpg" alt="logo" style="height:65px;">
</a>
<div class="container-fluid">
<div class="navbar-header">
<span class="navbar-brand">Qaneryararvik: The Yup'ik Word Place</span>
</div>
</div>
<!-- Links -->
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#">Words</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Acknowledgements</a>
</li>
</ul>
</nav>
最佳答案
应用此 CSS:
.navbar-header{
width: 100%;
text-align: center;
}
或者
您可以使用 Bootstrap 的 w-100 和文本中心类。
<div class="navbar-header w-100 text-center">
<span class="navbar-brand">Qaneryararvik: The Yup'ik Word Place</span>
</div>
关于html - Bootstrap 4 - 将品牌置于导航栏中心,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52941022/
相关文章:
javascript - 从 querySelectorAll 更改为 getElementsByClassName 后,按钮未按预期删除元素
html - 使 Twitter Widget 的高度与其父 Div 的高度动态成比例
html - SVG 笔划 url : linearGradient is working but solidColor is not
javascript - 当我尝试使用 setTimeout() 为其设置动画时,div 不会变小吗?
css - Rails Bootstrap 2.3.1 导航栏颜色
javascript - 如何在单击按钮时在 JavaScript 中创建动态数组