移動端&pc端 響應式布局 or rem布局 & flex布局

本文主要對以下問題的思考

當我門開發一個h5頁面時候，到底是 pc和h5共用一套頁面 還是分開開發兩套呢？

現象分析：

網易、淘寶等大廠 是 分開開發，也就是 pc一套，h5一套
拉鈎。某些個人博客 公用一套

結論

需要分情況而定，像網易淘寶此類的pc端頁面復雜的 是適合分開兩套開發，因為h5和pc端布局差異較大，不方便做響應式開發，
而個人博客這樣的 pc端就是一個列表而已 最多加一個側邊欄的 這種簡單的頁面 是比較適合 做響應式媒體查詢的 

具體的布局方式分析，其實網上有很多很詳細的教程了 我在這里只是簡單說明

• rem布局+flex

  1 設置視口

  2 根據公司ui根據那個尺寸的手機出的圖 比如是iPhone6 （750px） 動態改變跟頁面的fontsize
  document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + 'px';
  得出fontsize=100px
  3 得出整體寬度，得出畫一個100px寬的盒子需要多少rem
  那么整個屏幕的寬度就是 7.5rem
  ui圖100px的盒子 等於 2rem

  4 通過媒體查詢改變body的fontsize

  5 所有的字體依然按照px寫，只有盒子寬度按照rem去寫

  可參考：
  http://web.jobbole.com/93253/
  http://www.cnblogs.com/lyzg/p/4877277.html

• 響應式布局 （媒體查詢）

  就根據 不同的幾個寬度 動態設置我們body的最大寬度就行了，不要全部是100%
  效果可參考 http://justyeh.com/