html{height:100%;overflow:auto}
.offcanvas-stop-scrolling{height:100%;overflow:hidden}
.navbar-default .navbar-offcanvas{background-color:#f8f8f8}
.navbar-inverse .navbar-offcanvas{background-color:#222}
.navbar-offcanvas{
    position:fixed !important;
    width:100%; /* 默认全屏宽 */
    max-width:100%;
    right:-100%; /* 初始位置在右边屏幕外 */
    top:0;
    padding-left:15px;
    padding-right:15px;
    z-index:999;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    -webkit-transition:all 0.15s ease-in;
    transition:all 0.15s ease-in;
}
.navbar-offcanvas.in{box-shadow:0 0 20px rgba(0,0,0,0.3)}
.navbar-offcanvas.navbar-offcanvas-fade{opacity:0}
.navbar-offcanvas.navbar-offcanvas-fade.in{opacity:1}
.navbar-offcanvas.offcanvas-transform.in{-webkit-transform:translateX(-100%);transform:translateX(-187%);z-index: 9999;} /* 调整动画效果 */
.navbar-offcanvas.offcanvas-position.in{right:0} /* 调整最终位置 */
.navbar-offcanvas.navbar-offcanvas-right{left:auto;right:-100%}
.navbar-offcanvas.navbar-offcanvas-right.offcanvas-transform.in{-webkit-transform:translateX(-100%);transform:translateX(-100%)}
.navbar-offcanvas.navbar-offcanvas-right.offcanvas-position.in{left:auto;right:0}
.navbar-offcanvas .dropdown.active .caret{border-top:0;border-bottom:4px solid}
.navbar-offcanvas .dropdown-menu{
    position:relative;
    width:100%;
    border:inherit;
    box-shadow:none;
    -webkit-transition:height 0.15s ease-in;
    transition:height 0.15s ease-in;
}
.navbar-offcanvas .dropdown-menu.shown{display:block;margin-bottom:10px}
.offcanvas-toggle .icon-bar{background:#000;-webkit-transition:all .25s ease-in-out;transition:all .25s ease-in-out}
.offcanvas-toggle.is-open .icon-bar:nth-child(1){-webkit-transform:rotate(45deg) translate(9px, 9px);transform:rotate(45deg) translate(9px, 9px)}
.offcanvas-toggle.is-open .icon-bar:nth-child(2){opacity:0}
.offcanvas-toggle.is-open .icon-bar:nth-child(3){-webkit-transform:rotate(-45deg) translate(4px, -4px);transform:rotate(-45deg) translate(4px, -4px)}

/* 媒体查询：电脑模式 */
@media screen and (min-width: 768px) {
    .navbar-offcanvas {
        width: 500px; /* 电脑模式下宽度为500px */
        right: -500px; /* 初始位置在右边屏幕外 */
    }
}