MenuToggle 不会显示响应式导航栏

Question

我已经做了研究，到目前为止我已经尝试了几乎所有的方法。我正在创建一个带有滑动推送菜单的响应式网站。我仍在学习 Java 和 jQuery 所以我最终严格地通过 CSS 编码创建它。为此，我使用了：

  #menu-toggle:checked + .menu {
    position: absolute;
    left: 0;
        }

然后我将左边的属性应用到我的 .menu 上，值为 -240px。但是，当我单击菜单按钮时，导航栏拒绝显示。最重要的是，我的代码编辑器似乎无法识别 'transition' 属性。

这是我的 html 和 css 文档的 link。这是一个学术作业。

我把我的 responsive.css 放在了 Java 脚本箱中，所以这没有错。

Answer 1

你犯了一些错误，例如：

你在jsbin的脚本面板中添加css

那你这个写错了css:

#menu-toggle:checked + .menu {
    position: absolute;
    left: 0;
}

改为：

#menuToggle:checked ~ .menu {
    position: absolute;
    left: 0;
}

有 menuToggle 没有 menu-toggle。并使用 ~ 而不是 +.

MenuToggle won't show for responsive navigation bar