1.750的設計圖，20px為多少rem？

　　首先設計圖是UI設計提供給前端開發工程師的設計稿，750的設計圖出自于手機屏幕為375px*667px的iphone678手機屏幕的設計稿，這里也可以稱之為2倍圖。20px的字體大小涉及到了單位的轉換，頁面中默認的字體大小為16px，那么此時的1rem = 16px；

　　那么20px通過計算得出公式 1rem = 16px; ?rem = 20px; 得出結果為:1.25rem

　　擴展1：

　　因為他的設備像素比(dpr=物理像素/CSS像素)是2;dpr是一個固定的比值;不同的手機型號比值不應：

　　物理像素：可以理解成你ps里面測量的距離的大小

　　CSS像素：你編寫開發代碼的時候CSS里面給定的像素值；

　　dpr固定值如下如：

　　2、app怎么做適配的？

　　· 基于手機系統開發的app(原生Android/IOS)

　　· 另外一種是webapp

　　· 設置以下標簽：

<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />

　　具體的含義為：app完成的頁面的寬度等于設備的寬度，頁面的縮放比例為1.0，不允許最大縮放；

　　· 使用媒體查詢和響應式做適配

　　· 使用媒體查詢檢測設備屏幕的大小改變布局樣式，但是成本耗費比較大，不易操作

　　· 使用單位自己單位中經常使用的封裝好的flexble.js文件做適配

　　· 封裝好的flexble.js文件文件可以做到適配，并且原理是已經封裝好的視口和設備像素比基于webapp開發

　　3、bfc是什么，清楚浮動的原理

　　- BFC含義：

　　- 塊格式化上下文(Block Formatting Context，BFC) 是Web頁面的可視CSS渲染的一部分，是塊盒子的布局過程發生的區域，也是浮動元素與其他元素交互的區域

　　- BFC觸發條件：

　　- 根元素

　　- float屬性不為none(脫離文檔流)

　　- position為absolute或fixed

　　- display為inline-block,table-cell,table-caption,flex,inine-flex

　　- overflow不為visible

　　- BFC布局規則：

　　- 內部的Box會在垂直方向，一個接一個地放置。

　　- Box垂直方向的距離由margin決定。屬于同一個BFC的兩個相鄰Box的margin會發生重疊(按照最大margin值設置)

　　- 每個元素的margin box的左邊， 與包含塊border box的左邊相接觸

　　- BFC的區域不會與float box重疊。

　　- BFC就是頁面上的一個隔離的獨立容器，容器里面的子元素不會影響到外面的元素。

　　- 計算BFC的高度時，浮動元素也參與計算

　　更多關于前端培訓的問題，歡迎咨詢千鋒教育在線名師，如果想要了解我們的師資、課程、項目實操的話可以點擊咨詢課程顧問，獲取試聽資格來試聽我們的課程，在線零距離接觸千鋒教育大咖名師，讓你輕松從入門到精通。