<div class="container">
  <div class="border-box">
  border-box
  </div>
  <div class="content-box">content-box</p></div>
  <div class="padding-box">padding-box</p></div>
  <div class="text-box">TEXT</div>
</div>

.container div{
  margin:20px;
  width:400px;
  height:400px;
  padding:20px;
  font-weight:bold;
  border:double 10px rgba(255, 203, 2, .7);
  color: rgba(255, 203, 2, .7);
  text-align:center;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content: center;
}

.border-box{
  background-image:url(https://picsum.photos/id/1041/960/540);
  background-size:cover;
  background-clip:border-box;
  font-size:50px;
}
.content-box{
  background-image:url(https://picsum.photos/id/1041/960/540);
  background-size:cover;
  background-clip:content-box;
    font-size:50px;
}
.padding-box{
  background-image:url(https://picsum.photos/id/1041/960/540);
  background-size:cover;
  background-clip:padding-box;
    font-size:50px;
}
.text-box{
  background-image:url(https://i.picsum.photos/id/1041/960/540);
  background-clip: text;
  -webkit-background-clip: text;
  text-align:center;
  font-size:80px;
}