仅当我将鼠标悬停在其上时如何使图像出现

Posted 2023-03-06

【中文标题】仅当我将鼠标悬停在其上时如何使图像出现

【英文标题】：How to make image appear only when I hover on it

【发布时间】：2020-02-08 10:31:23

【问题描述】：

我希望我的图像仅在我将鼠标悬停时出现，我尝试将它放在样式部分但它不起作用。这段代码对吗？

<style type=“text/css”>
imgopacity: 0;
img:hoveropacity: 1;
</style>

【问题讨论】：

工作正常。 jsfiddle.net/2ry3n45a

您似乎在使用无法识别的引号。尝试“而不是”

只是好奇_我想知道你用什么软件来写你的代码......

【参考方案1】：

您使用了错误类型的引号。

将“text/css” 更改为"text/css"。

不正确

<style type=“text/css”>
  img 
    opacity: 0;
  

  img:hover 
    opacity: 1;
  
</style>

正确

<style type="text/css">
  img 
    opacity: 0;
  

  img:hover 
    opacity: 1;
  
</style>

【讨论】：

我不知道你是怎么发现这个的。荣誉。

很多年前，当我复制粘贴一些代码示例时，我遇到过这种情况，代码在样式标签之外工作，但不在其中。这是一个幸运的猜测。