导航栏位置

Question

我目前正在建立我的摄影作品集网站。 我尝试将导航栏放置在徽标下方，但是无法将导航栏与徽标的大小和位置匹配。

知道如何使用CSS定位导航吗？

（附带的照片）

谢谢enter image description here

Answer 1

快速修复。英雄是flexbox

header {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.logo,
nav {
  width: inherit;
  text-align: center;
}

ul {
  list-style: none;
  width: inherit;
  display: flex;
  justify-content: space-between;
}

<header>
  <div class="logo"><img src="https://via.placeholder.com/300x100"></div>
  <nav>
    <ul>
      <li>Home</li>
      <li>About</li>
      <li>Portfolio</li>
      <li>Contact</li>
    </ul>
  </nav>
</header>