为什么这些其他相对价值观大部分都不起作用？

Question

我正在尝试其他一些css值，包括ex，ch，cap，lh，但只有ex似乎有效。为什么这是其他人不再支持或我使用它们错了？

https://developer.mozilla.org/en-US/docs/Web/CSS/length

https://jsfiddle.net/c7ns5oy0/58/

  div{
    margin: 1px;
  }
  .ex{
    width: 200px;
    height:3ex;/** the ex value works!**/
    background-color: red;
  }
  .ch{
    width: 200px;
    height: 2ch; /**shouldnt it be equal to the height of 2 "0"s?**/
    background-color: red;
  }
  .cap{
      width: 200px;
      height: 3cap; /**shouldnt it be equal to the height of 3 "L"s?**/
      background-color: red;
  }
  .lh{
      line-height: 50px;
      width: 100px;
      height: 100px;
      border: 1px solid blue;
  }
  .lh div{/***it seems to have zero height and width, shouldnt this be 50px in height and width?**/
      width: 1lh;
      height: 1lh;
      background-color: blue;
  }

Answer 1

根据Mozilla文档，

cap和lh尚不支持。

至于ch，文档说明测量值是0的宽度而不是它的高度。如果您的高度大约为零的2倍，则需要将2ch替换为4ch

  

表示元素字体中字形'0'（零，Unicode字符U + 0030）的宽度，或者更确切地说是高级测量值。

.ch{
  width: 200px;
  height: 4ch;
  background-color: red;
}

https://jsfiddle.net/koralarts/vhsLpLdq/1/