是否可以将 Bootstrap 5 图标与 Bootstrap 4 一起使用

Question

如标题所述，我想在 bootstrap 4 项目中使用 bootstrap 5 图标。 那是因为我有一个使用 bootstrap 4 + 字体的旧版 web 应用程序，我需要使 web 应用程序与 bootsrap 5 Z2567A5EC9705EB7AC2C984033E06 应用程序一起工作。

Bootstrap 4 和 5 具有相似的外观和感觉，因此外观没有问题，但图标集不同，这是一个问题。

Answer 1

引导图标和引导前端工具没有任何链接。 它们是相互独立的，所以一起使用没有问题，并且没有 Bootstrap 图标 5 版本最新的图标版本是 v1.9.0。

下面给出的示例同时使用了 bootstrap v1.9.1 图标和 bootstrap v4.6.2 框架

 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous"><link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-icons/1.9.1/font/bootstrap-icons.min.css" rel="stylesheet"/> <h1 > This is a Bootstrap icon v1.9.1 <i class="bi bi-android2"></i></h1> <h1 > Below example is component in Bootstrap v4.6.2</h1> <div class="alert alert-primary" role="alert"> A simple primary alert—check it out! </div> <div class="alert alert-secondary" role="alert"> A simple secondary alert—check it out! </div> <div class="alert alert-success" role="alert"> A simple success alert—check it out! </div> <div class="alert alert-danger" role="alert"> A simple danger alert—check it out! </div> <div class="alert alert-warning" role="alert"> A simple warning alert—check it out! </div> <div class="alert alert-info" role="alert"> A simple info alert—check it out! </div> <div class="alert alert-light" role="alert"> A simple light alert—check it out! </div> <div class="alert alert-dark" role="alert"> A simple dark alert—check it out! </div>