css元素固定

css元素固定

  • 固定顶部
    加入我们将一个头部导航栏固定

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    .menu {
    position: fixed; /* 关键 */
    top:0; /* 关键 */
    max-width: 640px;
    z-index: 999;
    margin:0 auto;
    background: #fff;
    width: 100%;
    height: 50px;
    border-bottom:1px solid #eee;
    box-shadow:0px 3px 6px rgba(0,0,0,0.09)
    }
  • 固定底部

比如我们将footer 固定底部

1
2
3
4
5
6
7
8
.footer {
width: 100%;
max-width: 640px;
position: fixed; /* 关键 */
bottom: 0; /* 关键 */
text-align: center;
height: 50px;
}