如果想只用 CSS 的 transition 做出 fade-in 的效果,又需要在 display: noneblock 之間切換時,opacity 的 transition 會失效

以前查到的做法,是改用 height: 0; overflow: hidden; 來達成「隱藏」這件事。但這樣在某些排版下會發生問題,例如這東西有 margin 的時候

最近才查到:如果把 opacity 的變化改寫成 animation 的話,就可以維持使用 display: none 但仍保有 fade-in 效果了