59

CSS3 文档讨论了 :hover 和 :focus ,这对我来说似乎完全一样。两者有什么区别?我没看到什么?

谢谢!

4

8 回答 8

74

当鼠标指针悬停在元素上时,悬停为“真”。如果光标在该元素中,则焦点为真。悬停可能为假而焦点为真(例如单击文本字段然后将鼠标移开)

于 2011-05-26T19:11:43.813 回答
12

:hover适用于鼠标光标当前所在的任何元素。 :focus指表单焦点,是当前具有焦点的表单元素。粗略地说,如果您开始输入,您将填充哪个元素?

于 2011-05-26T19:12:21.790 回答
7

:hover和的区别在于:focus

:hover当您的鼠标指针位于元素上时。

:focus当您选择一个元素时,该元素会成为焦点。

更多信息:W3Schools 的 CSS 伪类

于 2016-07-29T06:34:37.597 回答
1

仅当指针设备位于元素上方时才适用悬停。文档说得很清楚。

于 2011-05-26T19:11:21.140 回答
1

悬停您可以使用新的 css3 技术添加带有转换时间的百分比百分比。预计 IE9 所有主要浏览器都会支持它们。这是两个导航菜单的一些示例,用于了解悬停和悬停动画以及 css3 悬停属性中颜色的褪色。`

于 2012-11-10T15:19:29.167 回答
0

悬停特别是关于鼠标指针

当 Mouser 指针位于/在) Button上时的示例,因为该按钮 hovertrue

焦点是关于突出显示的元素:

通常当我们使用 tab 键来改变元素的焦点时。

于 2019-01-29T09:30:27.797 回答
0

两者之间存在“对比差异”:

Hover- 当您的鼠标指针悬停(挥动或浮动)在特定元素上时。

Focus- 当您选择一个元素时,该元素就会成为焦点。

于 2020-12-29T15:47:12.617 回答
0

这两件事(即悬停和焦点)之间的主要区别是:

悬停:- 当您将鼠标指针放在特定元素上时,例如按钮、文本字段等。

焦点:- 当您选择一个元素或单击一个事件时,它会更改其原始状态并看起来不同。

于 2022-01-06T11:55:20.180 回答