<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Strait">
<div class="container mt-4" style="font-family: 'Strait', sans-serif;">
<h2 class="mb-4">Card with background image</h2>
<div class="card card-body mb-3 text-center arka">
<h2 class="card-title">Soru</h2>
<p class="card-text" style="font-size:18px">
Lorem Ipsum, adı bilinmeyen bir matbaacının bir hurufat numune kitabı oluşturmak üzere bir yazı galerisini alarak karıştırdığı 1500'lerden beri endüstri standardı sahte metinler olarak kullanılmıştır. Beşyüz yıl boyunca varlığını sürdürmekle kalmamış, aynı zamanda pek değişmeden elektronik dizgiye de sıçramıştır.
</p>
</div>
<div class="card card-body mb-3 text-center arka">
<h2 class="card-title">Soru</h2>
<p class="card-text" style="font-size:18px">
Lorem Ipsum, adı bilinmeyen bir matbaacının bir hurufat numune kitabı oluşturmak üzere bir yazı galerisini alarak karıştırdığı 1500'lerden beri endüstri standardı sahte metinler olarak kullanılmıştır. Beşyüz yıl boyunca varlığını sürdürmekle kalmamış, aynı zamanda pek değişmeden elektronik dizgiye de sıçramıştır.
</p>
</div>
<div class="card card-body mb-3 text-center arka">
<h2 class="card-title">Soru</h2>
<p class="card-text" style="font-size:18px">
Lorem Ipsum, adı bilinmeyen bir matbaacının bir hurufat numune kitabı oluşturmak üzere bir yazı galerisini alarak karıştırdığı 1500'lerden beri endüstri standardı sahte metinler olarak kullanılmıştır. Beşyüz yıl boyunca varlığını sürdürmekle kalmamış, aynı zamanda pek değişmeden elektronik dizgiye de sıçramıştır.
</p>
</div>
</div>
.arka {
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKef4R7ztpscFzQcTBRlsBMXNWN68ssKScRBlTwU2u4SOdlmau6wy81q1d2hBZlln3d9DecN478MxL4hZgDDZfZ3LMZw88YCIAcOOmj8GGW-Zb861wqlI0V6lLEJp3AixEg4HQCO1ajvMRg9Mh5MaSWt1snWb2rzVW_HNP6_Nx5-cXdKKHxwnghuW-vd8C/s1600/obp-bg.png');
background-repeat: no-repeat;
background-position: top;
background-size: 100% auto;
border: 1px solid #e3e3e3; /* Bootstrap 3 Well görünümünü andırması için */
border-radius: 4px;
}
/* İçeriklerin üst üste binmemesi için padding desteği */
.card-body {
padding: 2rem;
}
