CSS:在iPhone和iPad上的Safari中悬停时,点击时添加的类发生冲突

时间:2018-07-17 04:50:35

标签: css iphone ipad safari less

第一件事是,我只能编辑代码的CSS/LESS部分。

我遇到了一个问题,有一个跨度,其跨度在:hover上添加了背景色,并且在单击时具有不同的背景,从而通过JS获得了一个.active类。

问题是,在iPad和iPhone上,第一次点击将激活:hover样式,需要再次点击以打开添加的类.active。任何人都知道如何忽略:hover样式并直接添加类吗?

非常感谢!

3 个答案:

答案 0 :(得分:0)

将所有:hover规则放在@media块中:

@media (hover: hover) {
    a:hover { color: blue; }
}

答案 1 :(得分:0)

这样做

a:hover {
  background-color: transparent !important; /* If it works without adding !important, then do that. It's best to avoid !important */
}
<a href="#">Focus</a>

答案 2 :(得分:0)

这似乎是一个已知问题。请检查“ https://getbootstrap.com/docs/3.3/getting-started/#support-sticky-hover-mobile”以了解更多详细信息。解决上述问题的解决方案很少是“ http://www.javascriptkit.com/dhtmltutors/sticky-hover-issue-solutions.shtml