1. px
px
是像素单位。它是代表显示器上每一个显示的像素点,根据用户屏幕显示器的分辨率决定。
2. em
em
为相对单位,相对于当前元素内文本的字体尺寸。如果当前元素没有指定字体尺寸,那么以浏览器默认的字体尺寸为准。
例如,当前元素设置了字体尺寸为24px
,那么2em
就代表48px
。
3. rem
rem
为相对单位,相对于<HTML>
元素文本的字体尺寸。如果<HTML>
元素没有指定字体尺寸,那么以浏览器默认的字体尺寸为准。
例如,<HTML>
元素设置了字体尺寸为24px
,那么2rem
就代表48px
。
4. vw和vh
vw
和vh
是相对单位,相对于当前视口。
例如,10vw
代表当前视口宽度的10%
,20vh
代表当前视口高度的20%
。
5. %
%
是相对单位,相对于父元素的相关尺寸。
例如,父元素设置了height: 100px
,那么它的子元素height: 50%
就代表50px
。