html - 我如何让 Navbar 居中？

Question

我之前看过这里，但没有任何效果。我正在使用 Bulma Framework，我认为这是闻所未闻的，但我希望你能帮助我将品牌链接放在导航栏的中心。这就是我现在拥有的:

.navbar {
  background-color: #0a0a0a;
  color: white;
  height: 9%;
}

.navbar .navbar-brand > .navbar-item,
.navbar .navbar-brand .navbar-link {
  color: white;
  font-family: 'Wavehaus';
}

我在 Codepen 上有一个链接，这样它就可以可视化了:

https://codepen.io/anon/pen/BwrWwg

请注意，字体不会显示。

Answer 1

您只需要为 navbar 设置正确的 display。目前，Bulma 使用 Flex Layout。现在清除 flex 并使其使用 block 将使其工作:

.navbar .navbar-brand {
  text-align: center;
  display: block;
  width: 100%;
}

.navbar .navbar-brand > .navbar-item,
.navbar .navbar-brand .navbar-link {
  display: inline-block;
}