rem 比例值適配

時間 2021-08-14

標籤 html ide 佈局 scala htm rem 欄目 HTML 简体版

原文原文鏈接

<!doctype html><html lang="en" style="font-size: 37.5px;"><head>    <meta charset="UTF-8">    <meta name="viewport"          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">    <meta http-equiv="X-UA-Compatible" content="ie=edge">    <title>Document</title>    <style>        *{            margin:0;            padding:0;        }        #box{            width:4.24rem;            height:2.373rem;            margin-left:.56rem;            margin-top: 5.333rem;            background:#886;        }    </style></head><body><div id="box"></div><script>    // 獲取佈局視口寬度//     var width = document.documentElement.clientWidth;//     var fontSize  = width / 10;//     // 設置新的 font-size//     document.documentElement.style.fontSize = fontSize + 'px'    //   最終    window.onresize = function(){        // 設置新的 font-size        document.documentElement.style.fontSize = document.documentElement.clientWidth / 10 + 'px'    }</script></body></html>

1. Rem 等比適配始末
2. rem 固定值適配
3. rem適配
4. react適配 rem px to rem
5. rem適配佈局
6. REM適配實踐
7. rem與less適配
8. 移動端（二）——移動端適配方案之viewport適配、比例縮放適配和百分比適配
9. 移動端適配以及百分比佈局與rem比較
10. 移動端適配之REM
更多相關文章...
• PHP 類型比較 - PHP教程
• SQL NULL 值 - SQL 教程
• 適用於PHP初學者的學習線路和建議
• IntelliJ IDEA 代碼格式化配置和快捷鍵

相關標籤/搜索