英文:
How can I customize Bootstrap with Sass if I use it via CDN?
问题
The Bootstrap 5.3文档关于Sass自定义的部分解释了如何使用Sass的custom.scss脚本来覆盖Bootstrap设置。我明白，当Bootstrap是手动下载或通过包管理器下载时，custom.scss脚本需要引用这些下载的文件，类似于@import "../node_modules/bootstrap/scss/bootstrap";。
然而，假设我没有下载Bootstrap，而是想通过CDN来导入Bootstrap，就像下面这样：
<!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-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
</head>
<body>
<h1>Hello, world!</h1>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
</body>
</html>
我是否仍然可以使用相同的方法？如果可以，@import命令中应指定什么路径？
英文:
The Bootstrap 5.3 doc on Sass customization explains how to override Bootstrap settings using the Sass custom.scss script. I understand that, when Bootstrap was downloaded either manually or via the package manager, the custom.scss script needs to refer to these downloaded files, with something like @import "../node_modules/bootstrap/scss/bootstrap";.
However, suppose I did not download Bootstrap, but instead I want to import Bootstrap via CDN, like so:
<!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-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
</head>
<body>
<h1>Hello, world!</h1>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
</body>
</html>
Can I still use the same approach? If so, what path should I specify in the @import command?
答案1
得分: 2
你可以像这样导入外部文件到你的custom.scss中：
@import url(https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css);
但我建议通过包管理器或手动下载Bootstrap。
英文:
You can import external files to your custom.scss like this:
@import url(https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css);
But I would recommend downloading Bootstrap via package manager or manually instead.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论