如何将外部css仅应用于特定区域

Question

我正在开发一个Web应用程序，它必须具有使用Bootstrap4.1或Bootstrap3查看区域的选项。所有应用程序都是使用Bootstrap3开发的：

我实现了在BT4和BT3之间切换的逻辑

但是当我插入Bootstrap4时，所有页面都会受到影响。

 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">

如何将Bootstrap4.1仅应用于特定区域？

Answer 1

行。你还有一些工作要做。

• 首先下载Bootstrap 4的源文件并打开bootstrap.scss文件。
• 用您选择的类名称封装整个CSS。

示例：

.your_class_name {
  /*Source files*/
}

现在你有了一个SCSS文件。

• 然后转到此link并复制粘贴代码并将其转换为CSS文件。

您会注意到所有Bootstrap课程都以您的班级名称开头。

• 将该文件复制到您的项目中。

在HTML代码中，只要您想使用Bootstrap 4类，只需从

开始

<div class="your_class_name">并将您的内容包含在其中。

Bootstrap 4的课程仅适用于所附的div的孩子。