Позиционирование. Текст на фото

body { 
  margin: 0; 
} 
 
.box { 
  width: 250px; 
  height: 250px; 
  background-image: url(https://www.thesun.co.uk/wp-content/uploads/2018/06/NINTCHDBPICT000414976532.jpg)  ; 
  background-position: center; 
  background-size: cover; 
  background-repeat: no-repeat; 
   
  display: flex; 
  align-items: flex-end; 
  justify-content: center; 
 
 
} 
 
.box span { 
  text-align: center; 
  color: #fff; 
  font-size: 24px; 
} 
 
/* затемнение по наведнии  */ 
.box { opacity:1; } 
.box:hover { opacity:.7; }

<div class="box"> 
<span>  Что надо знать о деле Ивана Голунова</span> 
</div>

.item { 
  width: 200px; 
  height: 100px; 
  background: purple; 
} 
 
.opacity { 
  height: 100px; 
  transition: 0.5s; 
} 
 
.img:hover .opacity { 
  background: rgba(0, 0, 0, 0.5); 
} 
 
.text { 
  color: #fff; 
}

<div class="item"> 
 
  <div class="img"> 
    <div class="opacity"> 
      <span class="text">Privet</span> 
    </div> 
  </div> 
</div>