1.

What is a card in Bootstrap?

Answer»

On many WEBSITES, you may have seen cards with images that describes the profile of an author or contributor. Create these using cards in Bootstrap, which is a BORDERED box with some padding around it.

Use the .card class to create a card in Bootstrap. With that, Bootstrap provides .card-body class to add content INSIDE it.

Let US now learn how to create a basic card in Bootstrap:

<!DOCTYPE html> <html lang="en"> <head>   <title>Bootstrap Card</title>   <meta charset="utf-8">   <meta name="viewport" content="width=device-width, initial-scale=1">   <link rel="stylesheet" HREF="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>   <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script> </head> <body> <div class="container">   <h2>Card</h2>   <div class="card">     <div class="card-body">Card Body</div>   </div> </div> </body> </html>

The output displays the following card:

With Bootstrap, you can also add card titles.



Discussion

No Comment Found