Как заставить изображение исчезать при наведении курсора мыши?

Question

Я получил этот совет:

.container img{
     width:125px;
     margin;0;
     padding:0;
     opacity:0.5;
}
.container img:hover{
   opacity:1;
} 

Пробовал, и он работал отлично!

Затем я использовал облегченную версию плагина Custom CSS Editor - вставил в него код и добавил контейнер классов <p class="container"> к изображениям, и это сработало.

Answer 1

Вы можете использовать свойство непрозрачности для изображения:

.container img{
  width:300px;
  margin;0;
  padding:0;
  opacity:0.5;
}
.container img:hover{
  opacity:1;
}

<div class="container">
  <img src="http://www.booths.co.uk/wp-content/uploads/640px-X-360px-Chocolate-MiniNests.jpg"/>
</div>