一个简单但恼人的错误。我无法使用cdn加载Bootstrap css
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap demo</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
</head>
<body>
<div class="flex-container">
<div class="card" style="width: 18rem;">
<img src="..." class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz" crossorigin="anonymous"></script>
</body>
</html>
Results
我试过很多CDN,官方的不起作用,有些我发现在线工作很好,但对于旧版本。
这个可以用,但它是旧版本<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
1条答案
按热度按时间xvw2m8pv1#
您在Bootstrap 5.3.0中使用的CDN链接似乎无法正常工作。
CDN有时会出现问题或暂时不可用。但是,也有可能您使用的链接不正确或过时。Bootstrap团队偶尔会更新他们的CDN链接,因此确保您使用的是正确的CDN链接。
截至2021年9月我的知识截止日期,Bootstrap 5.3.0的正确CDN链接应为:
如果此链接对您不起作用,我建议您尝试清除浏览器缓存并重新加载页面。有时,浏览器缓存文件的以前版本,导致意外行为。
此外,您可以使用以下链接尝试使用Bootstrap的最新版本:
此链接适用于Bootstrap 5.7.0,这是更新的版本。如果您决定使用此链接,请确保同时更新相应的bootstrap.bundle.min.js脚本标记。
如果这两种解决方案都不起作用,则可能是您的互联网连接或CDN提供商出现问题。在这种情况下,您可以考虑下载Bootstrap文件并将它们托管在项目中。
我希望这对你有帮助!