javascript - 无法将属性 "max-content"添加到 @key-frames

Question

我正在尝试制作可折叠的内容，但 css 不接受动画中的“max-content”属性。我收到错误:内容高度的“无效值:最大内容”。 当我在没有@keyframes 的情况下设置高度时它可以工作，但我希望它是动画的

.full {
    animation-name: fullText;
    animation-duration: 0.2s;
    animation-fill-mode: forwards;
  }

  .short{
    animation-name: shortText;
    animation-duration: 0.2s;
    animation-fill-mode: forwards;
  }

@keyframes fullText {
    from { height: 150; }
    to { height: max-content; }
  }

  @keyframes shortText {
    from { height: max-content; }
    to { height: 150; }
  } 

Answer 1

确保你的浏览器支持最大内容

https://caniuse.com/#search=max-content