做了一個適應所有手機端網頁螢幕的頁面，我這個頁面是使用的px轉換rem然後在每個頁面適配。

首先新增移動端meta頭部，即：

<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no">

然後使用了一個js包 這個包是專門用來轉換px和rem的   檔案地址    。將這個包貼上或者下載下來，然後在頁面的css下引入

如圖：

 之後我簡單寫了一下 發現很麻煩，然後我使用了scss，下面是安裝scss流程 也可以到官網去安裝

1：安裝 ruby  一路下一步就可以了 然後在CMD看看是否安裝成功   ruby -v

2: 安裝scss  

gem install sass

3：安裝scss編譯包

gem install compass

4：檢視是否安裝成功

sass -v

compass -v

 5：簡單寫一個scss檔案 然後編譯scss。編譯scss有3種方法：

1：
//單檔案轉換命令
sass input.scss output.css
2：
//單檔案監聽命令
sass --watch input.scss:output.css
3：
//如果你有很多的sass檔案的目錄，你也可以告訴sass監聽整個目錄：
sass --watch sass:css
 

 這裡我是用的第三種方法。附檔案路徑：

 px2rem.scss檔案：

@function px2rem( $px ){
	@return $px*320/$designWidth/20 + rem;
}

寫scss的時候要這麼寫：

@import '../utils/px2rem.scss';
$designWidth : 750; // ui給你的檔案寬度
div{
  background: yellow;
  height: px2rem(750);
  width: px2rem(750);
}

然後就可以看你的頁面了