无论屏幕大小如何，都会触发媒体查询答案

【问题标题】：media query is triggering regardless of screen size无论屏幕大小如何，都会触发媒体查询
【发布时间】：2018-05-26 16:06:17
【问题描述】：

我正在使用 Bootstrap 4.0 并正在用它创建一个 wordpress 主题，我已将 bootstrap.css 文件放在我的主题的 css 文件夹中，并将 bootstrap.js 文件放在 js 文件夹中我的主题。这些是这些文件夹中唯一的文件。

我在 index.php 文件夹中的代码是这样的：

<!DOCTYPE html>
<html>

<head>
    <title>Bootstrap</title>

    <link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/bootstrap.css">
    <link rel="stylesheet" href="<?php  bloginfo('stylesheet_url'); ?>">


</head>

<body>

    <nav class="navbar navbar-toggleable-md navbar-light bg-faded">
      <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <a class="navbar-brand" href="#">Navbar</a>
      <div class="collapse navbar-collapse" id="navbarNav">
        <ul class="navbar-nav">
          <li class="nav-item active">
            <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Features</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Pricing</a>
          </li>
          <li class="nav-item">
            <a class="nav-link disabled" href="#">Disabled</a>
          </li>
        </ul>
      </div>
    </nav>

</body>


</html>

我期待它提供导航栏like the one here

但是，它会折叠导航栏，就好像它在移动设备上一样。它将“导航栏”一词一直向右移动，并将所有页面组合成一个下拉菜单，然后将其移动到屏幕的左侧。

我创建了一个 html 文件，它的作用完全相同。

我的浏览器设置为 100%。我从来没有遇到过 Bootstrap 的这个问题。

有人对导致这种情况的原因有任何想法吗？我敢肯定，我完全错过了一些非常简单的东西。

【问题讨论】：

标签： html css wordpress twitter-bootstrap

【解决方案1】：

navbar-toggleable-md 在 Bootstrap v4 (Beta) 中是无效的语法。您正在寻找添加响应式切换汉堡菜单的类名称是navbar-expand-md

http://getbootstrap.com/docs/4.0/components/navbar/

上面的链接概述了版本 4s Navbar 组件，包括切换类。此类未在版本 3 中使用，但有关 3 到 4 转换的信息，我建议您阅读他们的迁移文档：

https://getbootstrap.com/docs/4.0/migration/

【讨论】：

嘿，你能链接到你的来源吗？我现在正在引导程序中构建一个站点，我想了解 3 -> 4 与 alpha 和 beta 之间的所有变化