jQuery Bootstrap CDN是什么呢？它是一個可以幫助開發者快速構建響應式網站的前端框架。當然，大家也可以選擇下載并使用本地文件，不過CDN將更加方便。

在使用jQuery Bootstrap CDN之前，需要先導入jQuery庫和Bootstrap庫。依次執行以下代碼即可：

<!--導入jQuery庫-->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<!--導入Bootstrap庫-->
<link rel="stylesheet" >
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.min.js"></script>

導入之后，就可以使用Bootstrap提供的各種樣式和組件了。比如，我們可以在HTML文件中使用下列代碼創建一個導航欄：

<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid">
<a class="navbar-brand" href="#">Brand</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Pricing</a>
</li>
</ul>
</div>
</div>
</nav>

以上代碼就創建了一個導航欄，并包含了3個菜單項。是不是看起來很簡單，且不用擔心兼容性問題呢？借助jQuery Bootstrap CDN，我們可以更加高效的進行前端開發。