我目前正在设计一个 CSS“超级下拉”菜单 - 基本上是一个常规的纯 CSS 下拉菜单，但包含不同类型的内容。目前，CSS 3 似乎正在过渡...

我目前正在设计一个 CSS“超级下拉”菜单 - 基本上是一个常规的纯 CSS 下拉菜单，但包含不同类型的内容。

目前， CSS 3 过渡似乎不适用于“display”属性 ，即您不能进行任何类型的从 display: none 到 display: block （或任何组合）的过渡。

当有人将鼠标悬停在顶级菜单项之一上时，上面例子中的第二层菜单是否可以“淡入”？

我知道您可以在 visibility: 属性上使用转换，但我想不出有效使用它的方法。

我也尝试过使用高度，但是失败了。

我也知道使用 JavaScript 实现这一点很简单，但我想挑战自己仅使用 CSS，但我认为我做得还不够。