我有一个菜单,当鼠标结束时,会逐渐将颜色从白色变为棕色。然而,当我离开鼠标时,过渡从白色开始,应该是从棕色到白色,我不知道为什么。当我移动鼠标时,过渡很好。我复制CSS:
li{
letter-spacing: 2px;
margin-bottom: -10px;
max-width: 280px;
opacity: 0.5;
transition: opacity 1s linear;
}
li:hover{
color: #9b2108;
opacity:1;
transition: opacity 3s linear;
}
问候。
答案 0 :(得分:0)
只有li元素需要应用过渡。
li {
letter-spacing: 2px;
margin: 0 0 -10px;
max-width: 280px;
opacity: 0.5;
transition: opacity 1s linear;
}
li:hover {
color: #9b2108;
opacity: 1;
}
答案 1 :(得分:0)
不确定你的意思,但看看这些变化。这是你在找什么?
li{
letter-spacing: 2px;
margin-bottom: -10px;
max-width: 280px;
opacity: 0.5;
transition: all 1s linear;
}
li:hover{
color: #9b2108;
opacity:1;
transition: opacity 3s linear, color 3s linear;
}
正如您所看到的,我在悬停时转换opacity
和color
,在您悬停时转换all
。 编辑:意识到您实际上也可以将悬停转换更改为all
。
或者如果您希望color
立即对悬停产生影响,您可以保留悬停转换。