About Lesson
Introduction to Bootstrap 5 Cards
Bootstrap 5 Cards are used to display content in a flexible and stylish manner.
The basic card structure consists of:
.card→ The outer container: Creates a card layout.card-body→ The content wrapper: Adds padding around content
Basic Card Example:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<title>Basic Bootstrap Card</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container mt-5">
<div class="card">
<div class="card-body">
<h5 class="card-title">Basic Card</h5>
<p class="card-text">This is a simple Bootstrap 5 card.</p>
</div>
</div>
</div>
</body>
</html>Output:
