如何在CSS中延迟：hover效果？

如何在CSS中延迟：hover效果？

:hover

如果效果是基于CSS的，则可以使用过渡来延迟所需的效果。

例如

div{    transition: 0s background-color;}div:hover{    background-color:red;        transition-delay:1s;}

这将使悬停效果（

background-color

在这种情况下）的应用延迟一秒钟。

---

悬停打开和关闭时的延迟演示：

div{    display:inline-block;    padding:5px;    margin:10px;    border:1px solid #ccc;    transition: 0s background-color;    transition-delay:1s;}div:hover{    background-color:red;}<div>delayed hover</div>

仅在以下位置悬停时演示延迟：

div{    display:inline-block;    padding:5px;    margin:10px;    border:1px solid #ccc;    transition: 0s background-color;}div:hover{    background-color:red;    transition-delay:1s;}<div>delayed hover</div>

---