我注意到MS Edge中的CSS转换存在一个奇怪的问题。
基本上如果你有一个转换,例如在悬停状态之间,但是为那些悬停状态定义的样式在CSS级联中被覆盖,Edge将在转换期间切换到覆盖的样式,然后转回来。
这里也很好地描述了这个问题: https://www.webmasterworld.com/css/4791912.htm
我还创建了一支笔来证明这个问题: http://codepen.io/powerbored/pen/OWqXRw
a {
transition: all 2s ease-in;
color: orange;
}
a div {
color: lightblue;
// displays in light blue in all browsers except during transitions in Edge
}
a:hover {
color: red;
}
我知道Edge并不是一个很棒的浏览器,但我真正希望看到的是对这里实际发生的事情及其原因的解释。
答案 0 :(得分:7)
有一些关于transition-property: all
的内容导致后代元素在转换期间继承动画值,而不是在Microsoft Edge中无限期地保留其指定值。这似乎特别针对Microsoft Edge的CSS转换实现,即使 Internet Explorer 也能正常运行,并且仅在transition-property
为all
时才会发生 - 如果您仅指定需要转换的属性,Microsoft Edge行为正常。
这就是我可以告诉你的全部内容。嗯,那个,以及这是不正确的行为这一显而易见的事实。