以前項目中動態(tài)控制html的字體大小, 讓頁面元素自適應(yīng)不同機型的屏幕，請教：用vue怎么實現(xiàn)這一功能，或者有其他什么好插件也期待您的推薦在線等 多謝
1 回答
慕妹3242003
TA貢獻1824條經(jīng)驗 獲得超6個贊
在根目錄的index.html動態(tài)設(shè)置基礎(chǔ)像素的大小
<script>
function setRootFontSize() { /*獲取屏幕的寬度*/
let width = document.documentElement.clientWidth || document.body.clientWidth /*屏幕小于414px會改變基礎(chǔ)像素，大于等于414px的屏幕基礎(chǔ)像素為13px不變*/
if (width < 414) { document.documentElement.style.fontSize = width / 375 * 13 + 'px'
}else { document.documentElement.style.fontSize = '13px'
}
}
setRootFontSize() window.addEventListener('resize', function () {
setRootFontSize()
}, false)</script>在scss文件中寫一個mixin函數(shù)
/*將px轉(zhuǎn)換成rem*/
@function px2rem($px) {
@return $px / 13 + rem;
}將文件寫成公共的樣式文件，或者用的時候引入
以上做完
直接使用px2rem(設(shè)置圖的像素大小)做到動態(tài)控制了
添加回答
舉報
0/150
提交
取消