我在那个网站上工作只是为了学习 HTML 和 CSS，而不是首先学习 JS。所以这就是为什么我在这里寻找一个没有 JS 的解决方案。当页面宽度小于 1081px 时，顶部的菜单按钮将变成汉堡菜单。如果单击，菜单按钮会在导航栏下方弹出 - 但是 - 不幸的是，这些按钮位于下面的框的顶部，我想在单击汉堡菜单时将其按下。有人可以给我一个关于如何做到这一点的提示吗？如果没有 jscript，我无法在网上找到任何解决方案。HTML： <!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="viewport" content="width-device-width, initial-scale=1.0"> <link rel="stylesheet" type="text/css" href="style.css"> <title>Rakete</title> </head> <body> <nav> <div id="navigation"> <div class="wrapper"> <div id="logo"></div> <label for="toggle">☰</label> <input type="checkbox" id="toggle"/> <div id="menu"> <a href="#">Home</a> <a href="#">About Us</a> <a href="#">Contact</a> <a href="#">Imprint</a> </div> </div> </div> </nav> <div id="main"> <div class="wrapper"> <div id="top-boxes"> <div class="box"></div> <div class="box"></div> <div class="box"></div> <div class="box"></div> <div class="box"></div> </div> <p> </p> </div> </div> </body></html>这是我的代码： https://codepen.io/andy4117/pen/NWqzqxo
1 回答
潇潇雨雨
TA贡献1833条经验 获得超4个赞
使用min-height而不是height用于您的#navigation造型。
老的
#navigation {
...
height: 5em;
...
}
新的
#navigation {
...
min-height: 5em;
...
}
注意：此解决方案特定于您的情况。不同的标记可能需要不同的解决方案。
- 1 回答
- 0 关注
- 47 浏览
添加回答
举报
0/150
提交
取消