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

Question

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

<style type=“text/css”>
img{opacity: 0;}
img:hover{opacity: 1;}
</style>

Answer 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>