如何在固定到底部的导航栏上向上而不是向下切换 react-bootstrap 导航

Question

我的导航栏有以下组件

 <div className="nav-div">
        <Container fluid>

          <Navbar collapseOnSelect expand="sm" className="navbar-nav py-4 mx-auto" fixed="bottom">

              <Navbar.Brand as={HashLink} to="/" className="fs-3">
                <FontAwesomeIcon icon={faHouse} />&nbsp;Timothy Lee
              </Navbar.Brand>

              <Navbar.Toggle aria-controls="responsive-navbar-nav" />

              <Navbar.Collapse id="responsive-navbar-nav">
             
                <Nav className="d-flex justify-content-end flex-grow-1" activeKey="/">                  
                    
                    <Nav.Link as={HashLink} to="/background/#education" className="nav-link fs-4">
                      <FontAwesomeIcon icon={faSchool}/>&nbsp;Education
                    </Nav.Link>

                    <Nav.Link as={HashLink} to="/background/#experience" className="nav-link fs-4">
                      <FontAwesomeIcon icon={faBriefcase}/>&nbsp;Experience
                    </Nav.Link>

                    <Nav.Link as={HashLink} to="/background/#skills" className="nav-link fs-4">
                      <FontAwesomeIcon icon={faWrench}/>&nbsp;Skills
                    </Nav.Link>

                    <Nav.Link as={HashLink} to="/background/#projects" className="nav-link fs-4">
                      <FontAwesomeIcon icon={faLaptopCode}/>&nbsp;Projects
                    </Nav.Link>

                </Nav>

              </Navbar.Collapse>

          </Navbar>
        
        </Container>
      </div>

到目前为止，导航栏的左侧将正常折叠，但是当您单击 3 行菜单时，它会向下打开，这意味着由于导航栏固定在底部，因此无法看到切换。

是否有一个字段可以使切换向上打开？