关于bootstrap4 以下 与bootstrap5 的区别

过年了，好无聊，顺便把bs5 学习了下，看了下B站的课程和官方文档，感觉比BS4 更容易操作了，慢慢的变成了一个组件性的东西，觉得跟vue.js 一起用，应该不错，特此总结说明下，BS5 与之前版本的区别，

目录

1.不支持IE浏览器

2.更加移动了,做移动更加灵活了，增加了 断点的功能,更加屏幕的大小，分为了5类，而且每类都能设定 显示位置

3.细节的问题增加了，背景色了，字体颜色了，可以直接在CLASS 里面设置了，不用特别设定style 了 ，也比较方便

4. 需要在 head 里面引入：（这个在BS4 里面就有要求，不算增加），不能貌似更加要求了，不加的话，根本用不了BS5

5.完全去掉jq(全部用自己的js就行了），仅仅导入2个文件（注意：这里是用的django的静态设置），主要是后面的2个文件(  bootstrap.min.css,bootstrap.bundle.min.js) ，导入这2个文件就能支持自己的全部内容，JS 里面也有说明用法，不过，不太习惯，习惯用自己的

6.颜色增加到到了8种，基本也够用了（跟前面的版本类似，可以用到各种地方）        

---

2.更加移动了,做移动更加灵活了，增加了 断点的功能,更加屏幕的大小，分为了5类，而且每类都能设定 显示位置

$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
  xxl: 1400px
);

大概 5类屏幕的选择，可以根据项目的要求 更加有针对性的设置，大概5个级别，当然了，也可以 通过 Sass 里面自己设置增加项，不过，一般的够用了

container-fluid-mb

3.细节的问题增加了，背景色了，字体颜色了，可以直接在CLASS 里面设置了，不用特别设定style 了 ，也比较方便

4. 需要在 head 里面引入：（这个在BS4 里面就有要求，不算增加），不能貌似更加要求了，不加的话，根本用不了BS5

  <meta name="viewport" content="width=device-width, initial-scale=1">

5.完全去掉jq(全部用自己的js就行了），仅仅导入2个文件（注意：这里是用的django的静态设置），主要是后面的2个文件(  bootstrap.min.css,bootstrap.bundle.min.js) ，导入这2个文件就能支持自己的全部内容，JS 里面也有说明用法，不过，不太习惯，习惯用自己的

<link rel="stylesheet" href="{% static 'css/bootstrap.min5.css' %}">
<script src="{% static 'js/bootstrap.bundle.min.js' %} "></script>

6.颜色增加到到了8种，基本也够用了（跟前面的版本类似，可以用到各种地方）        

$theme-colors: (
  "primary":    $primary,
  "secondary":  $secondary,
  "success":    $success,
  "info":       $info,
  "warning":    $warning,
  "danger":     $danger,
  "light":      $light,
  "dark":       $dark
);