Html 导航栏按钮折叠到侧栏

是否有办法在导航栏上的折叠按钮上实现侧栏

当我缩小屏幕时，我会看到导航栏上的折叠按钮，上面有所有的按钮

当我点击该折叠按钮时，它会展开导航栏并显示按钮。有没有一种方法可以代替这个展开按钮，在右边或右边显示一个侧栏，占据整个屏幕并显示导航按钮

在文件中添加以下css

@media only screen and (max-width: 767px) {
#collapsibleNavbar {position: fixed;top: 0;left: -100%;bottom: 0;display: block;max-width: 320px;width: calc(100% - 80px);min-height: 100%;z-index: 999;transition: all 0.3s ease;background: #000000;}
#collapsibleNavbar.show {left: 0;}
}

---

你能澄清这个问题和你想要达到的目标吗？“对还是错”是什么意思？你是说像这样还是这样？这就是我想要的！

@media only screen and (max-width: 767px) {
#collapsibleNavbar {position: fixed;top: 0;left: -100%;bottom: 0;display: block;max-width: 320px;width: calc(100% - 80px);min-height: 100%;z-index: 999;transition: all 0.3s ease;background: #000000;}
#collapsibleNavbar.show {left: 0;}
}