Html CSS:hover:延迟后

我有这个CSS：

.edit:hover:after{
    content: '✐';
}

我希望用户在内容出现之前将光标放在.edit类上2秒钟

我试过这种方法，但不起作用：

.edit:hover{
    -webkit-transition: 2s all;   
    -webkit-transition-delay: 2s; 
    -moz-transition: 2s all;   
    -moz-transition-delay: 2s; 
    -ms-transition: .2s all;   
    -ms-transition-delay: 2s; 
    -o-transition: 2s all;   
    -o-transition-delay: 2s; 
    transition: 2s all;   
    transition-delay: 2s; 
}

也在

和
上尝试了相同的代码。编辑：悬停：在
和
之后

html是一个简单的
元素

只有css才能实现这一点吗？
您可以尝试将转换放在after上：


。测试：在{
内容：“2秒后显示”；
不透明度：0；
过渡：2s全部；
}
.测试：悬停：之后{
不透明度：1；
过渡延迟：2s；
}

让我悬停2秒钟
您可以尝试将转换放在您的after上：


。测试：在{
内容：“2秒后显示”；
不透明度：0；
过渡：2s全部；
}
.测试：悬停：之后{
不透明度：1；
过渡延迟：2s；
}

让我悬停2秒钟
很好的解决方案，效果很好。我必须补充：在{content:✐";不透明度：0；}让它正确居中，但我可以接受。明天我会把它标记为正确答案。在文本消失之前，你的代码也会有2秒的延迟。有没有办法消除延迟？@GuillaumeF。在淡出之前没有延迟-只要你移走鼠标，就会发生-如果你ant为了加快它的速度，很好地解决了这个问题。我必须添加：在{content:✐“不透明度：0；}让它正确居中，但我可以接受。明天我会把它标记为正确答案。在文本消失之前，你的代码也会有2秒的延迟。有没有办法消除延迟？@GuillaumeF。在淡出之前没有延迟-只要你移走鼠标，就会发生-如果你我想加快速度