[分享]CSS中ex是什么单位

CSS中的ex是一个相对长度单位，基于小写字母“x”的高度计算。它可以用来在网页中设置字体大小和行高以及其他元素的高度。与像素单位（px）不同之处在于，ex单位是根据当前字体的高度计算而得到的。因此，...

CSS中的ex是一个相对长度单位，基于小写字母“x”的高度计算。它可以用来在网页中设置字体大小和行高以及其他元素的高度。

与像素单位（px）不同之处在于，ex单位是根据当前字体的高度计算而得到的。因此，它们具有一定的可伸缩性，可以在不同的屏幕和字体大小下给出相同的比例和比率。

p {
  font-size: 2.5ex;
  line-height: 3ex;
  height: 10ex;
} 

上面的代码将为p元素定义一个2.5ex的字体大小，3ex的行高和10ex的高度。这意味着文本将根据字体大小和行高更改其高度，并在不同的字体大小和屏幕上保持比例。

虽然CSS中的em和rem也是相对长度单位，但它们都是基于字母“M”的宽度计算而得到的。因此，在某些情况下，使用ex可能更为合适。

p {
  font-size: 2em;
  line-height: 3rem;
  height: 10ex;
} 

上面的示例使用em和rem定义了相同的属性，虽然它们都是基于字母“M”的宽度计算而得到的，但它们的比例可能会开始改变，特别是在缩放时。

总而言之，使用ex作为单位可以使文本在不同的屏幕大小和字体大小下保持稳定的比例，并且它们非常适合用于替代像素的绝对单位。