Lesson overview
You can use Bootstrap via CDN (fastest to start) or install it locally (better for offline work and advanced customization). Most learners should start with CDN to focus on layout and components first.
Learning outcomes
Option A: CDN setup (recommended for learning)
<!doctype html>
<html lang=”en”>
<head>
<meta charset=”utf-8″ />
<meta name=”viewport” content=”width=device-width, initial-scale=1″ />
<title>Bootstrap Starter</title>
<link href=”https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css” rel=”stylesheet”>
</head>
<body>
<main class=”container py-4″>
<h1 class=”h3″>Bootstrap is ready</h1>
</main>
<script src=”https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js”></script>
</body>
</html>
What the JS bundle does
Option B: Local setup (conceptual)
bootstrap.min.css and bootstrap.bundle.min.js.Recommended folder structure (simple)
index.htmlassets/
css/styles.css (your custom overrides)img/js/ (optional)Practice tasks
index.html with Bootstrap included via CDN.styles.css after Bootstrap and change the page background.Quick check
Lesson summary
Get the latest course releases and learning insights delivered straight to your inbox each week.
By subscribing you agree to our Privacy Policy and consent to receive updates from SkillNet.