CSS 拥有42种单位
原文中文，约3100字，阅读约需8分钟。
📝
内容提要
CSS目前有42种单位，包括常用的px、%、em、rem等。新单位dvh和dvw可以动态调整视口尺寸。虽然我只使用了20%，但这些单位在特定场景下各有其价值。
🎯
关键要点
-
CSS目前有42种单位，包括常用的px、%、em、rem等。
-
初学HTML/CSS时，常用单位仅有9种。
-
新单位dvh和dvw可以动态调整视口尺寸。
-
部分单位如px、%和em等在特定场景下各有其价值。
-
开发者通常只使用部分单位，常见的有Em和Rem。
-
CSS单位的数量从1996年的8-9种扩展至现在的42种。
-
像素(px)的定义存在争议，可能被视为相对单位。
-
Q单位和其他单位在特定情况下更为合适。
-
标准文本中对单位的定义和使用存在复杂性。
🔎
延伸解读
CSS单位的演变
CSS单位从1996年的8-9种扩展至如今的42种，反映了网页设计的复杂性和多样性。开发者在选择单位时，应考虑不同单位的适用场景，以提高页面的响应性和可访问性。
动态单位的应用
新引入的dvh和dvw单位能够根据视口变化动态调整，适用于移动设备和响应式设计。开发者在设计时应关注这些单位，以确保在不同设备上提供良好的用户体验。
单位选择的风险
虽然CSS提供了多种单位，但不当使用可能导致布局问题。特别是像素(px)的相对性可能引发混淆，开发者应谨慎选择单位，确保设计在不同屏幕和分辨率下的一致性。
❓
延伸问答
CSS中有哪些常用的单位？
常用的单位包括px、%、em、rem等。
dvh和dvw单位有什么特点？
dvh和dvw是动态单位，可以根据视口尺寸变化而调整。
CSS单位的数量是如何变化的？
CSS单位从1996年的8-9种扩展至现在的42种。
为什么像素(px)被认为是相对单位？
像素(px)的定义与屏幕分辨率有关，因此被视为相对单位。
在CSS中，em和rem有什么区别？
em是相对于元素自身的字体大小，而rem是相对于根元素的字体大小。
CSS单位的使用场景有哪些？
不同单位在特定场景下各有其价值，开发者通常根据需求选择使用。
🏷️
