em rem px diferencia vw/vh

ellos

Relativo al tamaño de fuente del elemento actual

div{
    font-size:10px;
    width:3em;//30px
}

movimiento rápido del ojo

rem es root em, relativo al tamaño de fuente del elemento raíz

html{
 font-size:20px;
}

div{
    font-size:10px;
    width:3rem;//60px
}

Cuando se trata de rem, muchas personas pensarán en la adaptación de rem: podemos usar consultas de medios para establecer el tamaño de fuente para lograr la adaptación.

@media only screen and (max-width: 374px) {
    /* iphone5 或者更小的尺寸e */
    html {
        font-size: 86px;
    }
}
@media only screen and (min-width: 375px) and (max-width: 413px) {
    /* iphone6/7/8等 */
    html {
        font-size: 100px;
    }
}
@media only screen and (min-width: 414px) {
    /* iphone6p 或者更大的尺寸 */
    html {
        font-size: 110px;
    }
}

píxeles

De hecho, no hay nada que explicar sobre px. Todos simplemente usan px cuando comienzan. px es píxel, la unidad básica.

[Consejos] El mini programa utilizará rpx para compatibilidad, 1px = 2rpx. El principio del mini programa rpx para compatibilidad es utilizar el ancho de pantalla de 375 como punto de referencia y utilizar el porcentaje para adaptarse al terminal móvil.

VW

1% del ancho de la pantalla

vh

1% de la altura de la pantalla