移動端響應式頁面開發說簡單也簡單，根據屏幕尺寸調節根字體大小。

大寬度用%，高度和小寬度全部使用rem，簡單粗暴。

之前閱讀過大漠老師的使用Flexible實現手淘H5頁面的終端適配,介紹了手淘項目的H5制作規范。

前端步驟

• 設置根字體大小:

html:{font-size:100px}

• js調節 1rem 對應的px大小

$(document).ready(function() {// put all your jQuery goodness in here.function adjust(){// 設計稿寬度是960pxvar scale = $('body').width() / 960;$('html').css('font-size', 100 * scale + 'px');}// 進入、刷新頁面時執行函數，調整根字體adjust();//視口大小調整時執行函數，調整根字體// 目測游戲內置頁面用不到，用戶不會產生resize事件$(window).resize(function(){adjust();}); });

總結

以上是生活随笔為你收集整理的简单粗暴的移动端页面开发技能的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。