Bootstrap 响应式导航栏

问题描述：
今天想做一个响应式的导航栏，可汉堡导航图标一直没响应，找了半天原来是Bootstrap版本问题，它在IE11上无法运行。
解决：
换成最新的bootstrap版本（bootstrap-4.4.1）就好了。

其实说到底还是自己太过粗心吧！
当固定导航条遮挡住内容时应该怎么办？
直接在文档完成之后给它添加一个导航栏的高度，（我这里是固定在上部所以用padding-top）,如果是固定在左边就是用padding-right.

        <script type="text/javascript">
            $(function () {
                avoidHide();

                function avoidHide() {
                    var onResize = function () {
                        // apply dynamic padding at the top of the body according to the fixed navbar height
                        $("html").css("padding-top", $(".fixed-top").height());
                    };
                    // attach the function to the window resize event
                    $(window).resize(onResize);

                    // call it also when the page is ready after load or reload
                    $(function () {
                        onResize();
                    });
                }
            });
           
    </script>