電商商城首頁總結
阿新 • • 發佈:2017-09-28
引入 fontsize 桌面 window turn 頁面 log screen scss
1.首先需要看設計稿是多少(750px),根據設計稿在設置rem,也就是設置html的字體大小,25*30=750
<!-- 在HTML開頭就引入動態獲取屏幕寬度 -->
<!-- rem實現適配 --> <script type="text/javascript"> // 頁面打開 立即計算 document.querySelector(‘html‘).style.fontSize = window.screen.width / 25 + ‘px‘; // 尺寸更改也會重新計算 // 這裏 寫這個事件的目的是 是為了 讓我們在 桌面端測試時 可以自動計算 移動端 window.onresize = function() { document.querySelector(‘html‘).style.fontSize = window.screen.width / 25 + ‘px‘; } </script>
在scss文件中設置rem @function p2r($size) { @return ($size/30) *1rem; }
電商商城首頁總結