代码之家  ›  专栏  ›  技术社区  ›  Rafhael Carrión Limaymanta

当屏幕达到660px时,如何隐藏边栏引导

  •  -1
  • Rafhael Carrión Limaymanta  · 技术社区  · 7 年前

    当我放大时,我试图隐藏Bootstrap的边栏。“@media-only-screen and(max-width:660px)”,但结果是它被自动部署,我不希望发生这种情况。

    Este es el código de bootstrap:

    @media only screen and (max-width:660px) {
    #header {
        height: 160px
    }
    
        #header .brand {
            width: 100%
        }
    
        #header .user-nav ul {
            padding-left: 0
        }
    
        #header .toggle-navigation.toggle-left {
            float: left
        }
    
    .sidebar {
        margin-left: -240px
    }
    
    .sidebar-toggle {
        margin-left: 0;
        width: 100%
    }
    
    
    
    .main-content-wrapper {
        margin-left: 0
    }
    
    .main-content-toggle-left {
        margin-left: 0px;
    }
    
    .sidebarRight {
        top: 160px;
        width: 100%
    }
    
    .user-nav ul li {
        font-size: 12px
    }
    
    
    }
    

    this is my html code

    1 回复  |  直到 7 年前
        1
  •  1
  •   JonasP    7 年前

    使用新类并插入 可见性:隐藏;

    @media(max-width: 660px){
      .hide{
        visibility: hidden;
      }
    }
    
    
    <nav class="sidebar sidebar sidebar-toggle hide">