**
pc端**一般我們都是以1366 +1200版心線來實現的，對於特殊需求，需要使用rem的適配方案，特此記錄下
記錄下方案：
以1920設計稿為基準
1、使用sass語法 轉換px rem ，靜態站點推薦使用我之前提到的 vscode外掛程式easy-scss
// px 轉 rem@function px2rem($px, $base-font-size: 18px) @else
if (unit($px) ==em)
@return ($px / $base-font-size) *1rem;
}
2、設定**查詢
@media screen and (max-width: 1920px)}@media screen and (max-width: 1680px)
}@media screen and (max-width: 1380px)
}@media screen and (max-width: 1300px)
}
3、還原設計稿
設計稿70px 高度對應 height: px2rem(70px);
rem手機端適配方案
1.頁面加入如下 function doc,win else if doc.addeventlistener return win.addeventlistener resizeevt,recalc,false doc.addeventlistener domcontentloaded recalc...
rem 適配方案
首先我們要明白，為什麼要用rem單位呢，常用的px不好嗎？原因是如果我們用px作為長度大小單位的話，就無法根據螢幕大小變化實時改變頁面元素的大小，反之，rem就可以做到實時適配。其次，我們也要清楚以rem為單位的元素大小是根據css html根標籤下的文字大小 fontsize 來改變的。在實際開發...
rem適配方案
em大小是基於父元素的字型大小 rem是相對單位，r是root的意思，在html頁面上就是html標籤，所以rem的大小是基於html元素的字型大小 使用flex的伸縮布局 使用百分比的流式布局 使用 查詢的響應式布局，共同點就是元素只能做寬度的適配 除外 rem適配可以實現寬度和高度都能做到適配，...