footer.php 固定底部,底部footer固定方式

相对固定，当页面内容高度不沾满浏览器高度，footer显示在浏览器底部，且不会出现滚动条，如果页面内容高度超出浏览器高度，footer则相对与内容的最底部，并且自动出现滚动条；

* {

margin: 0;

padding: 0;

}

html, body {

height: 100%;

}

.head {

width: 100%;

height: 50px;

background: red;

margin-bottom: -50px;

}

.wrap {

min-height: 100%;

}

.main {

padding-top: 50px;

padding-bottom: 50px;

}

.footer {

margin-top: -50px;

height: 50px;

background-color: yellow;

}

头部

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

内容，可以大量复制看效果

相对在底部