在 CSS 中，值为 0 时可以省略单位，是因为 0 无论是什么单位，其值都是相同的，即表示没有长度、宽度、厚度等等。 这适用于大多数属性，例如：
-
长度相关属性:
width,height,margin,padding,border-width,top,left,bottom,right,font-size,line-height,text-indent等等。0px,0em,0%,0rem,0pt等价于0。 -
角度相关属性:
rotate等。0deg,0rad,0grad,0turn等价于0。 -
时间相关属性:
transition-duration,animation-duration,animation-delay等。0s,0ms等价于0。
为什么可以省略？
CSS 规范明确允许在值为 0 时省略单位。 这是为了简化代码，提高可读性，并减少代码量。 解析器在遇到值为 0 但没有单位时，会自动将其视为 0，并根据属性的类型推断出合适的单位（即使实际上没有单位）。
例外情况：
虽然大多数情况下 0 可以省略单位，但也有一些例外：
-
flex-grow和flex-shrink: 这两个属性的值为比例，即使是 0 也需要写上，例如flex-grow: 0;。 省略单位会导致不同的行为。 -
line-height的特殊用法: 当line-height的值设置为一个数字（例如line-height: 1.5）时，它表示的是与字体大小的比例，而不是一个具体的长度值。 这种情况下，如果设置为line-height: 0，表示的是 0 倍字体大小，也就是 0 高度的行高，这通常会导致文本不可见。 而line-height: 0px则表示行高为 0 像素，这与line-height: 0的效果不同。
总而言之，在 CSS 中，值为 0 时省略单位是一种规范允许的简写方式，可以提高代码的可读性和简洁性。 但在少数情况下，例如 flex-grow, flex-shrink 和 line-height 的特殊用法，需要显式地写上单位。