gpt4 book ai didi

twitter-bootstrap - Bootstrap - navbar-fixed-top 覆盖内容

转载 作者:行者123 更新时间:2023-12-04 00:35:18 24 4
gpt4 key购买 nike

我有一个关于 navbar-fixed-top 的问题。好吧,我有一个简单的问题。我的固定导航栏涵盖了内容,例如在“关于我们”页面中,它涵盖了带有“关于我们”标题的行。

我不知道如何修复它,因为当我调整网站大小(移动设备大小)时,标题是可见的。

当然,我在其他页面(全宽和 404)中的标题存在这种问题。

此外,在索引页面中,它涵盖了一些轮播 slider 。

信息:

  • 网址:http://testerix.site90.com/index.html
  • Bootstrap 2.3.2

  • 让我知道,我怎样才能在所有分辨率上修复它。

    最佳答案

    响应在页面中:

    Twitter Bootstrap - top nav bar blocking top content of the page



    添加到您的 CSS:
    body { 
    padding-top: 65px;
    }

    或更复杂但响应迅速的解决方案,如果您的导航栏更改高度(平板电脑中的 ex 出现在 60 像素以上;或者不同),请使用带有 css 和 javascript 的混合解决方案

    CSS:
        #godown{
    height: 60px;
    }

    HTML(简历)
    <body>
    <nav class="navbar navbar-fixed-top " role="navigation" id="navMenu">
    ...

    </nav>

    <!-- This div make the magic :) -->

    <div class="godown-60" id="godown"></div>

    <!-- the rest of your site -->
    ...

    JAVASCRIPT:
    <script>
    //insert this in your jquery
    //control the resizing of menu and go down the content in the correct position

    $("#navMenu").resize(function () {
    $('#godown').height($("#navMenu").height() + 10);
    });

    if ($("#navMenu").height() > $('#godown').height()) $('#godown').height($("#navMenu").height() + 10);

    </script>

    关于twitter-bootstrap - Bootstrap - navbar-fixed-top 覆盖内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19741145/

    24 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com