以前寫移動端頁面最頭疼的就是圖片比例的問題，因為它的自動縮放，高度是不好控制的，那么他如何去固定呢，這就使用到了rem屬性，這段時間我用rem做了一個實例，濟南美思慕整形移動頁面：

這里面的圖片就全部固定了大小，

.jp-nr li img{width:26.33333rem; height:19.16666rem;}

但是rem不跟PX一樣直接量出來，它是通過效果圖的寬度計算出來的，我們這個頁面做的是750px寬， 那么計算這個的時候就用圖片的寬度除以12，就出來圖片的寬度了，但是有時候不是那么精準(zhǔn)，因為它不像PX一樣是固定的。那么這個12是哪里來的呢，這就用到了上次說的媒體查詢，

@media only screen and (max-width: 800px), only screen and (max-device-width:800px) {
 html,body {
 font-size:12.5px;
 }
 }
 @media only screen and (max-width: 720px), only screen and (max-device-width:720px) {
 html,body {
 font-size:11.25px;
 }
 }
 @media only screen and (max-width: 640px), only screen and (max-device-width:640px) {
 html,body {
 font-size:10px;
 }
 }
 @media only screen and (max-width: 600px), only screen and (max-device-width:600px) {
 html,body {
 font-size:9.375px;
 }
 }

你這里面對應(yīng)的字體是多大，你就用它本身的寬去除以你寫的像素就算出來了，建議大家先去自己寫個demo嘗試一下。