单击“输入”后将CSS转换出来

在输入字段中运行鼠标。
看起来不错，这就是我想要的效果。
现在-单击某个字段上的“保持”，查看它是如何变暗的？
放开鼠标按钮，观察它是如何立即回复到光线的

我想通过单击行为来扭转这种过渡效果：
它应该立即变暗，并在鼠标点击释放后变回光亮

这是否可能只使用CSS，同时保留原来的悬停效果

输入{
背景：#aa7fce；
边框：1px实心#4857bb；
颜色：#4857bb；
高度：24px；
框大小：边框框；
过渡：背景0.5s线性0s；
}
输入：悬停，
输入：焦点{
背景：#E2C2FD；
过渡：无；
}
输入：活动{
颜色：#E2C2FD；
背景：#4857bb；
过渡：背景0.5s线性0s；
}

将

转换：无

添加到

：活动

状态，并从

：焦点

删除转换

输入{
背景：#aa7fce；
边框：1px实心#4857bb；
颜色：#4857bb；
高度：24px；
框大小：边框框；
过渡：背景0.5s线性0s；
}
输入：悬停，
输入：焦点{
背景：#E2C2FD；
}
输入：活动{
颜色：#E2C2FD；
背景：#4857bb；
过渡：无；
}

你……你在跟我开玩笑吗？我已经试过了，但没有成功work@RozzA您可能保留了

transition:none

属性在

input:hover，input:focus

ahh中，您的编辑现在显示了我遗漏的内容。非常感谢@罗兹：是的，忘了提那件事。当您向元素添加一些转换时，您会将该转换提供给元素的所有状态（：active，：hover，…）。因此，从

：focus

中删除

转换：none

，意味着他将使用主转换-聚焦。将

transition:none

添加到

：active

意味着您将覆盖主代码。希望现在更清楚一点：）@RozzA。干杯