昨天去面試，面試官竟然說他們用**查詢針對不同的螢幕寬度做了9個不同的rem布局，呵呵...
eg:html
div上面例子中div寬度為320，因為他是16乘以根元素的font-size的值。
每次裝置螢幕寬度變化時，讓根元素的font-size變化；
320屏寬時，font-size：20px, 16rem能佔滿屏
新裝置寬度，為了16rem也能佔滿屏，所以要重新計算一下font-size.,
新螢幕寬度/16即可。
(function change()
window.addeventlistener('resize',change,false);
change();
)();
Rem布局的原理解析
rem作用於非根元素時，相對於根元素字型大小 rem作用於根元素字型大小時，相對於其出初始字型大小 mdn em作為font size的單位時，其代表父元素的字型大小，em作為其他屬性單位時，代表自身字型大小 mdn 從作用上可以看出,rem可以用來解決等比例縮放問題，也就是響應式問題。而em用來解...
rem布局和hotcss原理分析
rem布局的開源方案hotcss,其原理個人理解如下 手機px 手機頁面寬度 設計稿寬度 設計稿px 手機rem 手機px fontsize 手機頁面寬度 設計稿寬度 設計稿px fontsize 裝置螢幕寬度 設計稿寬度 設計稿px fontsize hotcss對fontsize的設定 root...
grid布局和rem的原理
1 形成乙個網格結構 父元素新增 display grid 2 劃分行和列 grid template columns grid template rows 如果是3個值 代表3行或3列 能接受具體的px 也能是百分比 劃分行和列的時候的關鍵字 和 方法 a repeat 重複的次數,重複的值 b ...