如何使图像仅在我悬停在图像上时出现

Question

我希望仅在将鼠标悬停在图像上时才显示图像，然后尝试将其放在样式部分中，但该图像不起作用。这个代码正确吗？

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

Answer 1

You are using the wrong type of quotation marks.

Change the “text/css” to "text/css".

Incorrect

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

  img:hover {
    opacity: 1;
  }
</style>

Correct

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

  img:hover {
    opacity: 1;
  }
</style>