Yii2:如何更改 Select2 小部件的字体系列 [英] Yii2: How to change font-family of Select2 widget

问题描述

我有一个 select2 小部件，我需要更改其字体-家庭.

I have a select2 widget and I need to change its font-family.

<?= $form->field($model, 'my_number')
    ->widget(Select2::classname(), [
        'items' => ['One' => 'One', 'Two' => 'Two', 'Three' => 'Three'],
        'class' => 'form-control',
]) ?>

Bootstrap 没有可以改变它的类，所以我想我需要改变它的风格.

Bootstrap doesn't have a class to change it so I think I need to change its style.

推荐答案

当您使用 KartikSelect2 并为 select2 自定义 Font-family，您需要更新在 select2-krajee.css 文件中添加的以下类.它们是如果要更改font-family

As you are using Kartik Select2 and to customize the Font-family for the select2 you need to update the following classes that are added in the select2-krajee.css file.They are divided into 2 groups if you want to change the font-family

.select2-container--krajee .select2-selection{
   font-family:Roboto, sans-serif !important;
}

对于下拉选项

.select2-container--krajee .select2-results__option{
   font-family:Roboto, sans-serif !important;
}

更改字体颜色/大小

对于选定的选项

.select2-container--krajee .select2-selection--single .select2-selection__rendered{
    color:red !important;
}

对于默认占位符

.select2-container--krajee .select2-selection--single .select2-selection__placeholder{
    color:red !important;
}

为了更改下拉选项的颜色，使用与顶部第一部分中为 font-family 选项列出的相同的类，即 .select2-container--krajee.select2-results__option.

For changing the color for the dropdown option the same class is used that is listed for the font-family option in the first section on top, i.e .select2-container--krajee .select2-results__option.

希望能帮到你

这篇关于Yii2:如何更改 Select2 小部件的字体系列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！