Как спрятать текст при наведении на изображение?

введите сюда описание изображения

Как реализовать даное действие?


Ответы (1 шт):

Автор решения: vantal

.block{
  position: relative;
  width: 180px;
}
.block img{
  max-width: 100%;
}
.block_title{
  position: absolute;
  bottom: 0;
  background-color: black;
  color: white;
  width: 100%;
  padding: 10px 0;
  text-align: center;
}
.block:hover .block_title{
  display: none;
}
<div class="block">
  <img src="https://st2.depositphotos.com/2001755/5408/i/450/depositphotos_54081723-stock-photo-beautiful-nature-landscape.jpg" alt="">
<div class="block_title">Надпись на картинке</div>
</div>

→ Ссылка