Javascript 选择2 4.0.0：多个元素的不同框高度

我刚刚了解了如何设置select2输入框的高度

现在我有另一个问题

例如，有些框应该只有一行高（默认值），其他框应该是100px，其他框应该是200px

现在，我正在使用这个css作为一个大的输入框

.select2-container .select2-selection--multiple{
    min-height:100px;
    padding-bottom: 20px;
}

但这显然会改变页面上所有框的高度

---

如何调整单个框的高度？

在现有类之后的

Select2.css中添加以下类

.select2-container-bigger{
    min-height:200px;
    padding-bottom: 20px;
}

并按如下方式创建元素：-

<span class="select2-container">
  <input type="text" 
       id="text1" class="select2-selection--multiple"/>
  <input type="text" 
       id="text2" class="select2-container-bigger"/>
</span>



注意
css类
是如何在文件中定义的。它是
select2 container
，然后是
select2 selection--multiple
。因此，后者应包含在具有前一类的元素中

在我们的例子中，带有
id=“text1”
的输入元素包含在类类型
select2 container
的span元素中。因此，将“子”类指定给内部元素。因此，根据
CSS
类结构构造元素，并将所需的类分配给相应的元素。
我发现您必须在select2元素的构造函数中分配CSS类（在JS部分）

在containerclass中，您可以简单地传递应该应用的多个不同的类，并用空格分隔
tpx-select2-container
是我正在使用的皮肤，而
select2 bigbox
和
select2 small
是我自己编写的类

他们的内容看起来就像这样：

。选择2大框{
最小高度：300px！重要；
}

我这边的问题是，我把CSS调用中的“classA classB classC”和CSS定义中的“classA classB classC”混淆了

在CSS
.classA的定义中，classB{}
的意思是：“对于在classA中找到的每个classB元素，应用以下内容”

在CSS
的调用中，意思是：“应用classA和classB的所有样式”。
您可以为它们创建两个单独的类，每个类都具有所需的高度，或者动态地这样做。你这里有什么问题，你能说得更具体一点吗？我不知道如何命名这些类以及如何调用它们。select2容器。select2选择——select2 css中通常包含多个{}，所以我只需要覆盖它。在这里，我不知道如何/在何处包含“外来”类，我不确定这是否可行，因为我以前尝试过手动将类分配给实际的html输入元素，但没有做任何事情。我认为这必须在javascript内部完成，因为select2元素是在运行时创建的。（见我的答案）。还是对你的努力竖起大拇指。对不起。我不知道这些元素是由JS在运行时创建的。
 $("#bigbox").select2({
        //select2 parameters
        containerCssClass: 'tpx-select2-container select2-bigbox',
    });


$("#smallbox").select2({
    //select2 parameters
    containerCssClass: 'tpx-select2-container select2-smallbox',
 });