CSS显示属性上的过渡
我目前正在设计CSS“巨型下拉菜单”-基本上是一个常规的仅CSS下拉菜单，但其中包含不同类型的内容。
目前， 似乎CSS 3过渡不适用于’display’属性 ，即，您不能进行从display: none到display: block（或任何组合）的任何过渡。
当有人将鼠标悬停在顶层菜单项之一上时，是否可以通过上述示例使第二层菜单“淡入”？
我知道您可以在visibility:属性上使用过渡，但我想不出一种有效使用过渡的方法。
我也尝试过使用高度，但是那不幸地失败了。
我还知道使用JavaScript实现此功能很简单，但是我想挑战一下自己仅使用CSS，而且我想说的还有点不足。
问题答案：
您可以连接两个或多个过渡，visibility这是这次方便的事情。
div {
border: 1px solid #eee;
}
div > ul {
visibility: hidden;
opacity: 0;
transition: visibility 0s, opacity 0.5s linear;
}
div:hover > ul {
visibility: visible;
opacity: 1;
}
<div>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
</div>
（不要忘记transition属性的供应商前缀。）
-
问题内容： 显示属性和可见性属性之间有何区别？ 问题答案： 该属性仅告诉浏览器是否显示元素。它是可见的（-您可以看到）或不可见的（-您看不到）。 该属性告诉浏览器 如何 绘制和显示元素（如果有的话）-是将其显示为元素（即，与文本和其他内联元素一起流动）还是-level元素（即，具有height和width属性，你可以设置，它的浮动等），或（即它的作用就像一个黑匣子，但奠定了直列代替）和其他一些人（
-
问题内容： 每当我将其悬停在其父元素上时，我一直试图使用css来显示Hidden Div淡入。 到目前为止，我所能做的就是让隐藏的div显示出来，但是到目前为止，还没有轻松的过渡。 这是我的代码： HTML： CSS： 关于我在做什么错的任何线索吗？当我将鼠标悬停在按钮上时，只是试图为隐藏的内容提供平滑的效果。提前致谢！ 问题答案： 从页面中删除一个块，就好像它从来没有出现过一样。块不能部分显示；
-
问题内容： 是否可以使用默认值覆盖display属性？例如，如果我以一种样式将其设置为none，而我想以其默认值以其他方式覆盖它。 还是找出该元素的默认值然后将其设置为默认值的唯一方法？不想知道元素通常是block，inline还是任何一个… 问题答案： 浏览器的默认样式在其用户代理样式表中定义，您可以在此处找到其来源。不幸的是，级联和继承级别3规范似乎并未提出一种将样式属性重置为其浏览器默认值的
-
当用户单击下拉菜单按钮（class.drop）时，会将div与class一起删除。下拉菜单应并且当再次单击下拉菜单按钮时，将显示带有类的div。下拉菜单应
-
我有这段代码： ref是在一个IonList元素中定义的，但它表示display不存在于该元素中。我怎样才能做到这一点？我见过其他类似的帖子：post和it都没用
-
问题内容： 我似乎找不到具有多个属性的CSS过渡 速记 的正确语法。这没有做任何事情： 我用javascript添加了show类。元素变得更高且可见，它只是不过渡。在最新的Chrome，FF和Safari中进行测试。 我究竟做错了什么？ 编辑：为了清楚起见，我正在寻找简化我的CSS的简写版本。使用所有供应商前缀已经足够enough肿。还扩展了示例代码。 问题答案： 句法： 请注意，如果指定了延迟，