CSS和HTML的鼠标移出事件？

Question

4

我一直在搜索，但似乎找不到CSS中类似于:hover的鼠标移出方法。

是否有这样的方法，如果有，应该如何编码？

- John

2

CSS不是一种编程语言。你会期望mouseout选择器做什么呢？ - Pekka

有一个 JavaScript 事件可以添加到你的 HTML 元素 <a onmouseout="alert('You moved your mouse out of this text')">。但是 CSS 无法识别它，因为它不是一种编程语言。 - Kyle

你具体想做什么？如果你想以不同的方式（非JavaScript）实现你想要做的事情，那也是有可能的。但是，如果你试图实现一些行为方面的功能（而不是样式方面的），那么你就需要使用JavaScript。 - Alex Larzelere

Nick的答案是正确的。 - GoodSp33d

8个回答

1

这里有一个 :hover 伪类：

element:hover { color: red }

如果你想要找到当 :hover 状态结束的事件或选择器，那是不可能的。

你需要使用JavaScript和onmouseout事件来实现此功能。

- Pekka

1

- Sarfraz

1

在CSS中没有类似mouseout的选择器，但是元素的普通样式就是它的“mouseout”状态！

你到底想做什么，普通的CSS和:hover选择器无法涵盖？

很有可能可以使用JavaScript来实现。请参见此处或此处。

- Brock Adams

嗯，可能是想要在鼠标进入并离开时执行某些操作，而不是在页面加载等正常状态下执行。 - Robert Bradley

0

你正在寻找:hover伪类。

a:hover {background: red;}

将突出显示您悬停在其上的任何链接。

- phihag

0

据我所知，没有鼠标移出事件，但是如果你想要访问之前的链接，你可以使用。

a:visited{

}

- Salil

0

据我所知，以下是您可以使用的 CSS “事件”。

a（默认）， a:hover， a:active， a:visited

- Sniffer

1

è؟کوœ‰ه…¶ن»–çڑ„ï¼Œن¾‹ه¦‚:enabledم€پ:disabledه’Œ:checkedم€‚ - Brock Adams

0

鼠标移出CSS！

div:not( :hover ){ ... }

- Prada

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Nick Craver · Accepted Answer

您只需要使用:hover伪类，当您将鼠标移出元素时，它会返回到默认的非:hover状态，就像这样：

.class { color: black; } 
.class:hover { color: red; }

当你悬停时，颜色将变为红色；当你“mouseout”时，颜色将返回黑色，因为它不再匹配:hover选择器。这是所有浏览器的默认行为，在此无需进行任何特殊操作。

如果您想要执行编程操作，则需要寻找mouseout JavaScript事件。