CSS3 过渡最大高度 : 0 to max-height : 99999px

Question

你好

我正在尝试使用纯 css3 制作相应的标签，我知道转换不适用于 height : 0 到 height : auto 所以我尝试使用 max-height : 0 到 max-height : 99999px 。但我不知道为什么不起作用。

JSFiddle

Answer 1

试试这个 one .

您必须定位一个属性。如果你使用 all 这个词，您定位所有媒体资源。 Read about it on MDN .

div {
    transition: <property> <duration> <timing-function> <delay>;
}

示例:

.ac-container article {
  -webkit-transition: 5s all;
  -moz-transition: 5s  all;
  -o-transition: 5s all;
  -ms-transition: 5s all;
  transition: 5s all;
}

另一个错误，你忘记了一个;在:

.ac-container input:checked ~ article{
    max-height:999999px !important /* ; */
}

最后一件事，

如果您使用较大的值(如 999999px )和较小的过渡(如 0.5s )，过渡可能有效但您看不到它。

顺便说一下，您不需要关键字 !important在这里。