WeCodeAcademy

Bootstrap Get Started

A minimal Bootstrap page needs three things: the HTML5 doctype, the viewport meta tag (so phones scale the page correctly) and the Bootstrap CSS link.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>My page</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
  <h1>Hello, world!</h1>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
Examplehtml
Open in editor »

Put your content inside a .container (fixed width) or .container-fluid (full width). Bootstrap also resets the browser's default styles so pages look the same everywhere.

Quick check

Which meta tag makes Bootstrap pages scale on phones?

Finish the quick check (and any code exercise) to complete this lesson, or mark it done yourself.

Tip: use the left and right arrow keys to move between lessons.