Question

以下是小提琴，如果页脚上方的内容被page-wrap包裹，并且内容较少，则页脚会粘到其他位置，因此会有滚动条。有没有办法让这个小提琴以某种方式使它不应该依赖于page-wrap而我只需要在页脚上应用css。我要求这样做是因为以这种方式制作了50多页，并且仅将ss添加到页脚。我只需要更改页脚的头文件。

http://codepen.io/chriscoyier/pen/uwJjr

* {
    margin: 0;
}
html, body {
    height: 100%;
}
.page-wrap {
  min-height: 100%;
  /* equal to footer height */
    margin-bottom: -142px; 
}
.page-wrap:after {
  content: "";
  display: block;
}
.site-footer, .page-wrap:after {
  /* .push must be the same height as footer */
    height: 142px; 
}

Answer 1

<强>编辑：

http://jsfiddle.net/bWTwL/1178/

将此代码添加到您的jquery：

$('.page-wrap').css('min-height',($(window).height()-142)+'px');

这是你的CSS：

/* Mostly: http://ryanfait.com/sticky-footer/ */

* {
    margin: 0;
}
html, body {
    height: 100%;
}
.page-wrap {
  /* equal to footer height */
    height:auto;
}
.site-footer {
    background: orange;
    height:142px;
    display:block;

}

没有.page-wrap:after

没有页面包装的粘性页脚

1 个答案: