您好, 欢迎来到 !    登录 | 注册 | | 设为首页 | 收藏本站

使DIV垂直填充页面的其余部分?

使DIV垂直填充页面的其余部分?

您可以使用绝对定位。

<div id="content">
    <div id="header">
        Header
    </div>
    This is where the content starts.
</div>

BODY
{
    margin: 0;
    padding: 0;
}
#content
{
    border: 3px solid #971111;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #DDD;
    padding-top: 85px;
}
#header
{
    border: 2px solid #279895;
    background-color: #FFF;
    height: 75px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

通过#content绝对定位并指定top,right,bottom和left属性,您将获得一个div占用整个视口。

然后,设置padding-top#content为> =的高度#header

最后,将其放置#header在内部#content并进行绝对定位(指定顶部,左侧,右侧和高度)。

其他 2022/1/1 18:17:28 有464人围观

撰写回答


你尚未登录,登录后可以

和开发者交流问题的细节

关注并接收问题和回答的更新提醒

参与内容的编辑和改进,让解决方法与时俱进

请先登录

推荐问题


联系我
置顶