How to use CDN Links In Bootstrap
A Content Delivery Network is a network of distributed servers strategically placed around the globe to deliver web content efficiently to users. You can use CDN links to access Bootstrap’s CSS and JS files directly from remote servers. By integrating these CDN links in your HTML file, you ensure that your website benefits from the latest version of Bootstrap while taking advantage of the speed and reliability offered by the CDN.
Syntax:
<!-- Bootstrap 5 CSS via CDN -->
<link rel="stylesheet" href=
"https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
<!-- Bootstrap 5 JS via CDN -->
<script src=
"https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"> </script>
Linking Bootstrap 5 CSS via CDN:
<link rel="stylesheet" href=
"https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
Linking Bootstrap 5 JS via CDN:
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
Example: Illustration of installation of Bootstrap5 via CDN Links.
HTML
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>GfG</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css"></head><body> <h3 class="bg-success text-white "> w3wiki </h3> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"> </script></body></html> |
Output:
Output using CDN link
How to install Bootstrap 5?
Bootstrap 5, a popular front-end framework, empowers developers to create sleek and responsive websites with minimal effort. To install Bootstrap 5, you can choose from three methods including CDN links for quick integration, employ package managers like npm for seamless dependency management, or manually install Bootstrap files for greater customization control.
Table of Content
- Downloading the Bootstrap File
- Using CDN Links
- Using Package Managers