em:根据当前元素的font-size大小来确定,如当前font-size是14px 那么1em=14px;,如果是直接用em来设置字体大小那么此时的em是相对于父元素的字体大小。
rem:相对于根元素html的字体大小。例如:html的大小是20px那么在子元素当中1rem就等于20px。
百分比:使用固定宽时当视口变得比屏幕更窄时,它将从屏幕上消失。而使用百分比的宽度,宽度随着视口(viewport )的变化而变化;
在实际当中宽度一般是使用百分比,字体以及包含字体的部分是使用rem。一般情况下我们将html的字体大小设为一个百分比,这样html就会随着浏览器的默认字体大小改变而改变,包括缩小放大。这样我们就实现了字体和包含字体的部分跟随浏览器默认字体大小改变而改变,同时宽度也改变,从而实现自适应。
注意:一般来说浏览器给网页设置的默认基础字体大小是16像素,谷歌的浏览器字体大小不小于12px,所以如果设置的更元素字体大小小于12px那么将以12px计算