javascript - 为什么 导航栏元素放置在容器外部？

Question

我很好奇是否有人知道为什么语义导航栏 <nav>元件位于外部 <div class="container"> 之外？

来自 Bootstrap 导航栏文档: https://getbootstrap.com/components/#navbar

<nav class="navbar navbar-default">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-
toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-
expanded="false">
    <span class="sr-only">Toggle navigation</span>

我的理解(我认为)是，为了让 Bootstrap 能够，呃， Bootstrap ，所有内容都必须位于容器 > row > col 中。

现在已经使用了它一点，我知道有一些警告，并且“它并不总是那么简单”，所以我试图忠实地执行涉及挖掘我的应用程序前端的极其繁琐的工作，同时也理解我在做什么。

答案是否像(我的猜测)一样简单，<nav>是由于其特殊用例(特别是在站点/应用程序范围内导航的情况下)而创建的“特殊”元素，以生存在正常容器“外部”吗？

我自己采取的步骤:

1. 查看了 10 多个“类似问题”
2. 花时间访问 getbootstrap.com
3. 检查了 w3schools
4. Google 搜索 "<nav>"

Answer 1

“我的理解(我认为)是，为了让 Bootstrap 能够，呃，bootstrap，一切都必须位于容器 > row > col 中” - 为了让 Bootstrap 网格系统正常工作 - 是的。但导航通常一开始并不使用网格系统；大多数情况下，您有一个独立于网格的导航，后面是可能使用网格的主页内容。 – CBroe 1 分钟前

这回答了我的问题。谢谢。