2

当使用 CSS 过渡来创建淡入/淡出的翻转时,将它放在a选择器下方还是a:hover选择器下方更好?

我的直觉是把它放在a:hover选择器上,因为这是翻转的活动部分,但看看例子,人们似乎在之后声明它们a

两者似乎都工作得很好,但我真的很想知道哪个被认为是“正确的”,如果可能的话,为什么。

所以这:

a { color:blue; transition:.5s; }

a:hover { color:red; }

或者这个(我的直觉):

a { color:blue; }

a:hover { color:red; transition:.5s; }

谢谢。

故意省略供应商前缀

4

1 回答 1

3

这取决于您的需要,使用transition下面的属性a

a { color:blue; transition:.5s; }

当您将鼠标悬停/悬停元素以及鼠标悬停时将传输元素

这在哪里

a:hover { color:red; transition:.5s; }

只会在悬停时传输元素,当您取出鼠标时它会恢复正常。

演示(来回过渡)

演示 2(将仅在hover鼠标移开元素后进行传输并恢复正常)

注意:我增加了transition时间来展示它的实际重要性。


结论:一般来说,transition不应该使用on :hover,因为当鼠标移出元素时它不会过渡。但正如我再次所说,这取决于需求。

于 2013-10-09T12:23:44.167 回答