Bootstrap 4 Cards Examples


Example 1: card bootstrap 4

<div class="card" style="width:400px">     <img class="card-img-top" src="img_avatar1.png" alt="Card image" style="width:100%">     <div class="card-body">       <h4 class="card-title">John Doe</h4>       <p class="card-text">Some example text some example text. John Doe is an architect and engineer</p>       <a href="#" class="btn btn-primary">See Profile</a>     </div>   </div>

Example 2: boostrap card

<div class="card" style="width: 18rem;">   <div class="card-body">     <h5 class="card-title">Card title</h5>     <h6 class="card-subtitle mb-2 text-muted">Card subtitle</h6>     <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>     <a href="#" class="card-link">Card link</a>     <a href="#" class="card-link">Another link</a>   </div> </div>

Example 3: card bootstrap

<div class="card" style="width: 18rem;">   <img class="card-img-top" src="..." alt="Card image cap">   <div class="card-body">     <h5 class="card-title">Card title</h5>     <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>     <a href="#" class="btn btn-primary">Go somewhere</a>   </div> </div>

Example 4: bootstrap card

<div class="card" style="width: 18rem;">   <img src="..." class="card-img-top" alt="...">   <div class="card-body">     <h5 class="card-title">Card title</h5>     <p class="card-text">Some quick example text to build on the card       title and make up the bulk of the card's content.</p>     <a href="#" class="btn btn-primary">Go somewhere</a>   </div> </div>

Example 5: bootstrap card

bootstrap card

Comments

Popular posts from this blog

Are Regular VACUUM ANALYZE Still Recommended Under 9.1?

Can Feynman Diagrams Be Used To Represent Any Perturbation Theory?