论vw单位的实用性

今天偶然发现一个单位：‘vw’；我想说的是，实在太好用了：

px：没话说，固定单位，只能写得死死的，虽然任何地方都可以使用，（列如设置宽高，margin，font-size……）；
%：虽然可以实现响应，但是不是所有地方都能够使用，你不可能font-size还能设置百分比吧，而且还有一个问题是，也只有当直接父元素设置有宽高过后才能使用%，不然设置了也是白费，因为它没有一个参考点。再有就是，如果根源都是参照body和HTML标签，那么当浏览器窗口变化的时候，你的样式我想已经不成样子了，一团糟；

em：所有地方都可以用，可以实现响应，但是必须参照里它自身最近的一个父元素的font-size 的大小，越往后倍数不变，基数增大，即便是你都设有固定的font-size，那么后面的就会越来越大；列如：（

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
        body,div,span,ul,li {
            font-size: 2em;
            float: left;
        }
    </style>
</head>
<body>
    <div>4
        <span>3
            <ul>2
                <li>1
                </li>
            </ul>
        </span>
    </div>
</body>
</html>

效果是：

）；这样的话扎心了老铁；

rem:所有地方都可以用，但是都是参照html（根元素）的font-size大小；要实现响应就必须用媒体查询语句根据设备屏幕宽度变化而改变html标签的font-size；从而实现响应，但是变化是间断的，响应想过不怎么好，这样就会导致某些地方的样式在不同的视口宽度下变化很大，而且你还要写出很多媒体查询语句；很是麻烦；
vw：这个我只能说很nb，任何地方都可以使用，单位随着视口大小而变化，连续变化就和%的效果一样，但不像直接用%，宽度会以父元素宽度为基数，高度会以父元素高度为基数，而且%并不能用于任何地方， vw陪数是一样的，且能用于任何地方，说直接点你用vm写出来的页面，视口大小变化的时候，里面的字体，盒子大小，就像一张图片一样被缩放，很强势；