Bootstrap is a popular front-end framework for building responsive and mobile-first websites. It provides pre-designed CSS, JavaScript components, and utility classes to quickly create modern and consistent user interfaces.
- It Includes pre-built responsive grid systems for mobile-first design.
- Offers a wide range of UI components like buttons, modals, and navbars.
- Provides built-in support for responsive typography, spacing, and utilities.
- Extensively customizable via Sass variables and Bootstrap's configuration.
To start with Bootstrap, you need to install it on your project or use the CDN link. Follow these articles to install, depending on your system:
Let us now take a look at our first code example.
HTML
<html>
<head>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
crossorigin="anonymous"></script>
</head>
<body>
<div class="container text-center">
<h1 class="text-success">
Welcome to GeeksforGeeks
</h1>
<p class="text-dark">A Simple Example of Bootstrap</p>
</div>
</body>
</html>
Output