无法将属性“最大内容”添加到@ 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