移动端顶部和底部做法

用户的的设备太宽会导致图片失真的做法:

 

max-width 最大宽度 :当屏幕宽度大于等于750px的时候,body的宽度是750px,当屏幕宽度小于750px的时候,body的宽度和屏幕一样

body {

width:100%;

max-width:750px;

margin:0 auto

}

 

移动端顶部和底部固定定位的做法:

.head {

position:fixed;

/*一般情况下,绝对定位和固定定位如果没有加便宜,还在原来的位置*/

width:100%;

max-width:750px

}

.footer {

position:fixed;

bottom:0 ;

width:100%;

max-width:750px;

}

/*如果想要顶部和屏幕一样宽 可以添加left:0; 取消max-width,底部也是相同做法*/