【问题标题】:How to Start Toggle navigation bar from 1024px when resizing of browser调整浏览器大小时如何从 1024px 开始切换导航栏
【发布时间】:2016-11-17 02:34:57
【问题描述】:

我正在将静态页面转换为响应式页面。我的页面是一个导航栏,它在 768 像素后转换为切换导航栏。

我想自定义它自己的 Bowser 切换导航的宽度应该出现或不出现,最初我希望它出现在 1024px 之后,但它出现在 768px 之后。

请帮助我如何做到这一点。 请不要投反对票。它导致像我这样的初学者被stackverflow阻止。

【问题讨论】:

  • 与 768px 之后出现的导航切换分享您的代码

标签: html twitter-bootstrap css responsive-design


【解决方案1】:

使用这个:

@media (min-width: 768px) and (max-width: 1024px) {
    .navbar-collapse.collapse {
        display: none !important;
    }
    .navbar-collapse.collapse.in {
        display: block !important;
    }
    .navbar-header .collapse, .navbar-toggle {
        display:block !important;
    }
    .navbar-header {
        float:none;
    }
}

【讨论】:

    【解决方案2】:
      @media (min-width: 1024px) {
           /*toggle navigation class*/{
                   width=/*whatever*/
                 }
    }
    

    【讨论】:

    • 是的,例如,当我调整屏幕大小时,我想更改我的 h1 大小。这个 h1 在一个 div 中,具有“新”id 名称:@media screen 和(最大宽度:480px){#新 h1{ 字体大小:100%; } }
    • 这不适用于我的查询。你能给我提供一个小提琴切换导航栏的例子吗?
    • 为什么不使用bootstrap,它可以帮助您调整导航栏的大小与整个容器的大小没有问题
    • 我正在使用 boostarp。 Boostarp 允许在 768px 之后切换导航。我希望它以 1024px 开头。我试图输入我的代码,但 bootstarp 阻止了它
    • 这是一个纯代码的答案。请对其进行编辑以包含对它的作用、它解决什么以及它如何适应问题的描述。此外,您永远不会在 CSS 中看到等号 (=)。我认为您的意思是冒号(:)。与使用 cmets 相比,使用示例值并解释如何将它们更改为描述中的其他值会提供更多信息。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-12-15
    • 2016-02-08
    • 1970-01-01
    • 2018-03-31
    相关资源
    最近更新 更多