css - css 用于鼠标悬停时的永久更改

Question

visibility: hidden使用和可以很容易地在悬停时交换两个元素:hover。但是，即使鼠标离开元素，我也希望带有替换元素的第二个状态持续存在。使用 JavaScript 很容易做到这一点，但有没有办法在纯 CSS 中做到这一点？

Answer 1

CSS 是无状态的，所以没有办法永久地改变状态。我能想到的唯一接近的方法是增加元素的大小（或有一个很大的子元素），这样鼠标就不会离开，但它会掩盖页面和控件的其余部分。