移動端適配（rem單位定義方法）

注：移動端必須寫：

//頁面寬度為html字型大小的rem(即25rem)(推薦html字型大小設定為12px到25px之間，不能設定大於25px,

// w3c對網頁最小字型並沒有硬性的規定。只是我們在設計網頁的時候因為考慮到可閱讀性，最小一般為12px大小，
// 如果設定大於25px，可能最終的html的字型大小會小於12px)

/**

** 注意rem單位計算方法：
* 元素大小/設計稿的1/25 25分之一
* 320/640 *25 這是一半
**/

var mresize=function();
mresize();

2. 響應式布局

html @media only screen and (min-width: 401px)}

@media only screen and (min-width: 428px)}
@media only screen and (min-width: 481px)}
@media only screen and (min-width: 569px)}
@media only screen and (min-width: 641px)}

3.js定義meta 標籤放縮和html字型大小

//

1.獲取畫素比值 是裝置上物理畫素和裝置獨立畫素(device-independent pixels (dips))的比例。
var num = 1/window.devicepixelratio;
//2.動態生成視口標籤
document.write('');
//注：以上兩段js可以不用，直接寫meta標籤禁止放縮

//3.獲取頁面的十分之1
var width = document.documentelement.clientwidth/10;
//4.設定html字型大小為頁面十分之1 1rem就是頁面十分之1 
（w3c對網頁最小字型並沒有硬性的規定。只是我們在設計網頁的時候因為考慮到可閱讀性，最小一般為12px大小.）

document.getelementsbytagname('html')[0].style.fontsize = width+'px';

/**

** 注意rem單位計算方法：
* 元素大小/設計稿的1/10 十分之一
* 320/640 *10 這是一半
**/

移動端適配rem單位

1.rem單位 描述 rem是css中的乙個尺寸單位，和px，em等單位一樣，都是用來設定大小的。rem代表的含義為 是html的字型大小的多少倍 語法 document.documentelement.style.fontsize document.documentelement.clientwi...

移動端 單位 rem

rem是指相對於根元素的字型大小的單位 相對單位 rem和em的區別，em相對于父元素的字型大小的單位。rem相對於根元素html字型大小計算，px是乙個絕對的單位。所以rem可以實現強大的螢幕適配布局 例如 html btn 那麼.btn的寬度為120px 高度為60px 所以在做移動端適配的時候...

移動端rem適配

3 使用js 將設計圖劃分為10等份或者15等份。新建common.less檔案，這是乙個專門來適配的檔案。我們大概可以寫如下的檔案 設定常見的螢幕尺寸 修改裡面的html文字大小 a 一定要寫到最上面 html 我們此次定義的劃分的份數 為 15 no 15 320 media screen an...