<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 6 年前。
<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 6 年前。
我使用这段代码在鼠标进入图像 div 时显示一些文本:
col-1-1.mydiv-image:hover +.mydiv-title h3 {
background: linear-gradient( rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
opacity:1;
display:block;
transition: all 0.5s ease;
}
当鼠标悬停在图像上时没问题，但是当鼠标悬停在图像上并悬停在标题 (h3) 上时，不透明度返回到 0 :(
这是一个简短的视频，可以更好地理解 :) https://drive.google.com/file/d/0B554jP6zQzw-am83N2JHZnlWVWs/view
最佳答案
就像 Kyle Hawk 评论的那样。您只是告诉 .mydiv-title h3 在您将鼠标悬停在图像上时显示。当鼠标悬停在 .mydiv-title h3 上时，鼠标不再位于图像上方，它现在位于 h3 上方。
要解决此问题，您只需将 .mydiv-title h3:hover 添加到您的代码中即可。
col-1-1.mydiv-image:hover + .mydiv-title h3,
.mydiv-title h3:hover {
background: linear-gradient( rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
opacity:1;
display:block;
transition: all 0.5s ease;
}
关于css - 在图像悬停中显示 div (css)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43475371/