防止将鼠标悬停在活动状态上

Prevent hover over active state

本文关键字：活动状态 悬停 鼠标      更新时间：2023-09-26

如何防止悬停按钮，div，li如果它已经通过CSS具有活动状态？

#list-of-tests .item-test:hover {
    background-color: #4d5f75;
    border: solid 1px #4d5f75;
}
#list-of-tests .item-test:active {
    background-color: #93c3cd;
    border: solid 1px #93c3cd;
}

两种方式：

1） !important用于:active状态：

#list-of-tests .item-test:active {
    background-color: #93c3cd !important;
    border: solid 1px #93c3cd !important;
}

2） 指定多个状态：

#list-of-tests .item-test:active,
#list-of-tests .item-test:active:hover {
    background-color: #93c3cd;
    border: solid 1px #93c3cd;
}
相关文章：