Search code examples
htmlcsshoveropacity

How to make images revert the opacity affect when hovered?

For example, when I hover over an image that I've set an opacity on, I'd like the images to be nontransparent as it is initially.

Got it resolved now!

Solution

  • Simply use the :hover pseudoselector.

    img {
  opacity: 0.5;
}

img:hover {
  opacity: 1.0;
}
    <img src="https://s-media-cache-ak0.pinimg.com/236x/1c/74/6c/1c746c3dffb830b890a21e5bb1ef7500.jpg" height="200" width="200"