Question

我能够使用div创建导航菜单。

我现在需要使用导航和引导网格创建响应式导航栏。只是一个简单的导航栏，中心有4个水平链接。

问题：经过12个小时的搜索和阅读这么多网站，我找不到这样一个基本导航栏的例子。只是人们不使用<nav>而总是使用<div>吗？

在这一点上真的让人感到困惑，我感觉很愚蠢，因为我觉得网上会有这么多的例子。有人可以澄清吗？

谢谢！

Answer 1

<强>更新

我没有看到对bootstrap网格的原始需求。这是另一个利用它并使用来自bootstrap官方网站的标记的示例：https://codepen.io/anon/pen/qYjOgv

<强> HTML

<header>
    <nav class="row">
        <div class="col">col</div>
        <div class="col">col</div>
        <div class="w-100"></div>
        <div class="col">col</div>
        <div class="col">col</div>
      </nav>
</header>

<强> CSS

header {
  background: dodgerblue;
  padding: 30px;
}

.col {
  text-align: center;
}

<强>原始

这是一个使用flexbox的非常简单的基础。笔：https://codepen.io/anon/pen/odwjMO

<强> HTML

<header>
  <nav>
    <a>Link 1</a>
    <a>Link 2</a>
    <a>Link 3</a>
    <a>Link 4</a>
  </nav>
</header>

<强> CSS

header {
  background: dodgerblue;
  padding: 30px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

使用语义HTML - “nav”

1 个答案: