CSS中的单位的区别

1、px：绝对单位，代表屏幕中每个「点」，指定多大的px字体就有多大

2、em：1em的值  等于  父元素font-size的值。为每个子元素通过「倍数」乘以父元素的px值，如果我们每一层div都使用1.2em，最内层就会是16px x 1.2 x 1.2 x 1.2 x 1.2 x 1.2 = 39.8px。

3、rem：rem单位大小是根据 html根标签font-size来决定的，不是根据父元素来定的。为每个元素通过「倍数」乘以根元素的px值，如果我们每一层div都使用1.2rem，最内层就会是16px x 1.2 = 19.2px。

4、vw：

        ①1vw等于视口宽度的1%

        ②将屏幕分成100份，  1vw单位   等同于   屏幕宽度 的百分之一

        ③100vw=390px　　　　 x = 100px 　　　25.64vw=100px　

html {
    font-size: 25.64vw;
    font-size: 20px;
        }

.one {
            font-size: 0.16rem;
            width: 1rem;
            height: 1rem;
            background-color: red;
        } 

 5、 媒体查询：屏幕区间可写作 手机屏幕大小

@media screen and (min-width:801px) {
            p {
                background-color: #ccc;
                font-size: 25px;
            }
        }