.element {
max-height:0;
overflow:hidden;
transition:max-height .3s;
}
:checked ~ .element {
max-height:666px;
}
input[type="checkbox"] {
position:absolute;
clip:rect(0 0 0 0);
}
:checked ~ .check-in {
display:none;
}
:checked ~ .check-out {
display:inline-block;
}
.check-out {
display:none;
}
.check-in,.check-out {
color:#34538b;
cursor:pointer;
}
如果max-height值太大,在收起时会有“效果延迟”的问题。