用css实现鼠标悬浮在a元素上1秒后文字颜色变红

发布网友发布时间：2022-04-06 12:34

共1个回答

热心网友时间：2022-04-06 14:03

我想到的是 transition:color 0 ease-in 1s;

最后一个时间是延迟，使用时注意加上备浏览器前缀。

<!DOCTYPE html>
<html>
<head>
<style>
div
{
width:100px;
height:100px;
color: blue;
transition:all 0 ease-in 1s;

}

div:hover
{
color: red;
}
</style>
</head>
<body>

<div>test</div>

<p>请把鼠标指针移动到蓝色的 div 元素上，就可以看到过渡效果。</p>

<p><b>注释：</b>本例在 Internet Explorer 中无效。</p>

</body>
</html>

追问我用火狐测试的没用啊，什么情况？

追答

CSS 前缀，我不加你也就不加么？这四个写到一起，

-ms-transition:all 0 ease-in  1s;
-o-transition:all 0 ease-in  1s;
-moz-transition:all 0 ease-in  1s;
-webkit-transition:all 0 ease-in  1s;
transition:all 0 ease-in  1s;