CDN stands for Content Delivery Network. It is used to load the content of a particular framework or library in your HTML document to enhance the web page. Bootstrap CDN is used to add Bootstrap to HTML documents. You can add it using the <Link> tag inside the <head> to load Bootstrap CSS and the <script> tag to load the Bootstrap JavaScript at the end of the <body> tag.
Bootstrap CDN
The bootstrap CDN to include CSS and JavaScript in your HTML document are listed below:
CSS CDN
Use the below CDN to include Bootstrap CSS in your HTML document:
<link rel="stylesheet" href="https://webproxy.poorya-velaei-d67.workers.dev/https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">
JavaScript CDN
The below CDN can be used to include the Bootstrap JavaScript in your HTML document:
<script src="https://webproxy.poorya-velaei-d67.workers.dev/https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>
Example: The below code is an illustration that shows how you can add bootstrap CDN to your document and use its features.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,
initial-scale=1.0">
<title>Bootstrap CDN</title>
<link rel="stylesheet" href=
"https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">
</head>
<body>
<div class="container text-center">
<h1 class="display1 text-success">
GeeksforGeeks
</h1>
<p class="lead">
This page is styled using the Bootstrap only.<br/>
All buttons and text uses Bootstrap classes for styling.
</p>
<button class="btn btn-success">
Bootstrap CDN
</button>
<button class="btn btn-primary">
GeeksforGeeks
</button>
</div>
<script src=
"https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js">
</script>
</body>
</html>
Output:
