哪些 bootstrap css 和 javascript 文件应该链接到我们的 html 页面？

Question

我已经在我的电脑上下载了最新的 bootstrap 版本 4，它包含两个文件夹，一个 css 和另一个 js。 css 文件夹包含大约 12 个 css 个文件，而 js 文件夹包含大约 5 个 javascript 个文件。我们需要 link 所有这 17 个文件到我们的 html 页面吗？有没有简单的方法link css和js按文件夹？

Answer 1

一般使用这两个文件即可：

bootstrap.min.css
bootstrap.bundle.min.js

如果需要，您可以在本地提供服务，但使用 CDN 最简单。例如，这些是 v5.1.3 jsDelivr 链接：

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>

在 jsDelivr 部分下的 getbootstrap.com 找到最新的 CDN 链接。

其他文件只是完整 bootstrap 发行版的修剪版本。只有当您不想要完整的库并且您只想要一些特定功能时才需要它们。

例如，如果您只想使用bootstrap的网格系统而没有其他bootstrap功能，您可以使用bootstrap-grid.min.css 而不是完整的 bootstrap.min.css.

CSS files	Layout	Content	Components	Utilities
bootstrap(.min).css	Included	Included	Included	Included
bootstrap-grid(.min).css	Only grid system	✗	✗	Only flex utilities
bootstrap-reboot(.min).css	✗	Only reboot styles	✗	✗
bootstrap-utilities(.min).css	✗	✗	✗	Included

JS files	Popper	jQuery
bootstrap.bundle(.min).js	Included	✗
bootstrap(.min).js	✗	✗

Answer 2

里面<头>:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">

如果您使用的是 Bootstrap4 并且想使用 Javascript，您需要在包含 bootstrap javascript 标签之前包含 JQuery：之前

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns" crossorigin="anonymous"></script>

Answer 3

以下是 bootstrap-4.0.0 版本要附加的文件， Download Bootstrap from this

对于CSS,

<link href="~/YourPath/bootstrap.min.css" rel="stylesheet" />

对于 JS，

<script src="~/YourPath/bootstrap.min.js" type="text/javascript"></script>

哪些 bootstrap css 和 javascript 文件应该链接到我们的 html 页面？

Which bootstrap css and javascript files should be linked to our html page?

javascript

css

bootstrap-modal

bootstrap-4