將px轉換爲vw

前言:

       之前寫了個簡單的px轉換vw的頁面,記錄也分享下,很簡單實用的

效果圖:

源碼:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>自動轉換</title>
</head>
<body>
    <input id="user_width" type="text" placeholder="請輸入"/>px
    <button onclick="change()">轉換</button>
    <span id="vw_text"></span>
</body>
</html>
<script>
    function change(){

        let widthVal = Number(document.getElementById('user_width').value);

        let nowVW = widthVal/(1920/100);
        var reg=/^\d+[.]?\d{1,3}$/;
        console.log(widthVal+'=='+nowVW+'vw');
        document.getElementById('vw_text').innerText = '轉換結果:  '+nowVW+'vw';
    }
    


</script>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章