导航栏固定怎么设置内容距离导航栏高度

陈小小
  • 261

图片描述

顶部固定,原本是设置内容距离顶部50px,但是当浏览器缩小时,还是挡住了下面的内容,设成百分比在大屏时,内容和顶部有一大段空白距离,这样子的话应该怎么设置导航栏与内容之间的距离
图片描述

回复
阅读 5.8k
3 个回答

移动端页面,一般最小宽度是320。再小就是按键机了吧,你还有必要去做适配吗?

@media all and (max-width: 1200px) {
    .container {
        margin-top: 50px;
    }
}

@media all and (max-width: 768px) {
    .container {
        margin-top: 100px;
    }
}

已上代码IE9+,若要兼容IE9一下,可以用JS

var obj = $(window),
    container = $('.container');
obj.on('resize', function () {
    var width = obj.width();
    
    if (width > 768) {
        container.addClass('container1')
    } else {
        container.addClass('container2')
    }
})

可以试试用js,在页面初始化时,获取导航栏的高度,来设置内容距离顶部的距离

你知道吗?

宣传栏