當(dāng)前位置：
首頁 >
rem.js常用代码
發(fā)布時間：2023/12/10
34
豆豆
生活随笔
收集整理的這篇文章主要介紹了
rem.js常用代码
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
rem.js
(function flexible(window, document) {var docEl = document.documentElement;var dpr = window.devicePixelRatio || 1;// adjust body font size// 設(shè)置 em 默認(rèn)字體所對應(yīng)的大小function setBodyFontSize() {if (document.body) {document.body.style.fontSize = 12 * dpr + "px";} else {document.addEventListener("DOMContentLoaded", setBodyFontSize);}}setBodyFontSize();// 將視窗分為多少份// set 1rem = viewWidth / 10function setRemUnit() {var rem = docEl.clientWidth / 10;docEl.style.fontSize = rem + "px";}setRemUnit();// 當(dāng)頁面發(fā)生改變時，重新設(shè)置 rem 所對應(yīng)的刻度值// reset rem unit on page resizewindow.addEventListener("resize", setRemUnit);window.addEventListener("pageshow", function(e) {if (e.persisted) {setRemUnit();}});// detect 0.5px supportsif (dpr >= 2) {var fakeBody = document.createElement("body");var testElement = document.createElement("div");testElement.style.border = ".5px solid transparent";fakeBody.appendChild(testElement);docEl.appendChild(fakeBody);if (testElement.offsetHeight === 1) {docEl.classList.add("hairlines");}docEl.removeChild(fakeBody);} })(window, document);總結(jié)
以上是生活随笔為你收集整理的rem.js常用代码的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： python多个main方法_Pytho
- 下一篇： 零基础，新手小白看过来！易用可视化工具推