像素(px)：
- 最常用的单位，相对于显示器的分辨率。1px等于屏幕上的一个点。
- 例如：
width: 100px;表示宽度为100像素。
百分比(%)：
- 相对于父元素的尺寸。例如，如果一个元素的宽度设置为
50%，那么它将占据其父元素宽度的一半。 - 例如：
width: 50%;表示宽度为父元素宽度的50%。
视口宽度(vw)：
- 相对于视口（浏览器窗口）的宽度。
1vw等于视口宽度的1%。 - 例如：
width: 50vw;表示宽度为视口宽度的50%。
视口高度(vh)：
- 相对于视口（浏览器窗口）的高度。
1vh等于视口高度的1%。 - 例如：
width: 100vh;表示高度为视口高度的100%，即满屏高度。
视口最小宽度 vmin：
- 相对于视口的宽度和高度中的较小值。
1vmin等于视口宽度和高度中较小值的1%。 - 例如：
padding: 5vmin;表示内边距为视口宽度和高度中较小值的5%。
视口最大宽度 vmax：
- 相对于视口的宽度和高度中的较大值。
1vmax等于视口宽度和高度中较大值的1%。 - 例如：
font-size: 1vmax;表示字体大小为视口宽度和高度中较大值的1%。
em：
- 相对于当前元素的字体尺寸。
1em等于当前元素的字体大小。 - 例如：
font-size: 2em;表示字体大小是当前元素字体大小的两倍。
rem：
- 相对于根元素（html元素）的字体尺寸。
1rem等于根元素的字体大小。 - 例如：
font-size: 1.5rem;表示字体大小是根元素字体大小的1.5倍。