提示💡
作为全新的版本，Bootstrap 5 明确不再支持IE(Internet Explorer)浏览器。
入门使用
通过下一行命令添加到您的应用程序的入口点（包括 Bootstrap 中的 JavaScript脚本： index.js 、app.js)：
import 'bootstrap';
import 'bootstrap/dist/css/bootstrap.min.css';或者，您可以根据需要 单独导入插件:
import 'bootstrap/js/dist/util';
import 'bootstrap/js/dist/alert';
import 'bootstrap/js/dist/tab';
...常见的插件可以查看 引入单个JS插件。
常用模块
modal.js
<div class="modal fader" id="sidebar">
<div class="modal-dialog">
<div class="modal-content sidebar-container">
<div>
<i id="sidebar-back" class="icon_back"></i>
<div id="sidebar-header" class="sidebar-header">${getHtml(this.headerSlot)}</div>
<div id="sidebar-desc">${getHtml(this.descSlot)}</div>
<div id="sidebar-content" class="sidebar-content">${getHtml(this.contentSlot)}</div>
</div>
<div id="sidebar-footer" class="sidebar-footer">${getHtml(this.footerSlot)}</div>
</div>
</div>
</div>结构上必须要有 modal-dialog 否则会报错，Uncaught TypeError： Illegal invocation， 也需要 modal-content 否则内容无法正常显示。
变量设置
定义变量和使用变量。
:root {
--purple: #6f42c1;
}
.custom-element {
color: var(--purple);
}阅读更多内容：