CSS3 文档讨论了 :hover 和 :focus ,这对我来说似乎完全一样。两者有什么区别?我没看到什么?
谢谢!
CSS3 文档讨论了 :hover 和 :focus ,这对我来说似乎完全一样。两者有什么区别?我没看到什么?
谢谢!
当鼠标指针悬停在元素上时,悬停为“真”。如果光标在该元素中,则焦点为真。悬停可能为假而焦点为真(例如单击文本字段然后将鼠标移开)
:hover
适用于鼠标光标当前所在的任何元素。 :focus
指表单焦点,是当前具有焦点的表单元素。粗略地说,如果您开始输入,您将填充哪个元素?
仅当指针设备位于元素上方时才适用悬停。文档说得很清楚。
悬停您可以使用新的 css3 技术添加带有转换时间的百分比百分比。预计 IE9 所有主要浏览器都会支持它们。这是两个导航菜单的一些示例,用于了解悬停和悬停动画以及 css3 悬停属性中颜色的褪色。`
悬停特别是关于鼠标指针:
当 Mouser 指针位于/(在) Button上时的示例,因为该按钮 hover为true。
焦点是关于突出显示的元素:
通常当我们使用 tab 键来改变元素的焦点时。
两者之间存在“对比差异”:
Hover
- 当您的鼠标指针悬停(挥动或浮动)在特定元素上时。
和
Focus
- 当您选择一个元素时,该元素就会成为焦点。
这两件事(即悬停和焦点)之间的主要区别是:
悬停:- 当您将鼠标指针放在特定元素上时,例如按钮、文本字段等。
焦点:- 当您选择一个元素或单击一个事件时,它会更改其原始状态并看起来不同。