footer 固定到底部

mac2024-04-10  31

#container {                 /*保证footer是相对于container位置绝对定位*/                 position: relative;                 width: 100%;                 min-height: 100%;                 /*设置padding-bottom值大于等于footer的height值,以保证main的内容能够全部显示出来而不被footer遮盖;*/                 padding-bottom: 100px;                 box-sizing: border-box;                 height: auto;             }                          .header {                 width: 100%;                 height: 200px;                 background: #999;             }                          .main {                 width: 100%;                 height: auto;                 background: pink;             }                          .footer {                 width: 100%;                 height: 100px;                 /* footer的高度一定要是固定值*/                 position: absolute;                 left: 0;                 bottom: 0;                 background: #333;             }

最新回复(0)