display 切换与可过渡展开 | 星雨笔录

核心： display:none 传统上无法直接过渡；可用 opacity/grid-template-rows 或新式离散过渡处理。

最小示例：

.panel { display: none; opacity: 0; transition: opacity .3s, display .3s allow-discrete; }
.panel.open { display: block; opacity: 1; }
@starting-style { .panel.open { opacity: 0; } }

学完能做： 理解显示切换与展开过渡的实现条件。