将px转换为vw

最新推荐文章于 2025-06-25 14:07:07 发布

浩星

最新推荐文章于 2025-06-25 14:07:07 发布

阅读量7.4k

点赞数 1

CC 4.0 BY-SA版权

分类专栏：更多插件文章标签： javascript vue

本文链接：https://blog.youkuaiyun.com/qq_41619796/article/details/105536355

更多插件专栏收录该内容

92 篇文章

订阅专栏

前言：

之前写了个简单的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>