Question

我想更改其中一个选择框的字体大小。但它不起作用：

 <link href="http://cdnjs.cloudflare.com/ajax/libs/select2/3.2/select2.css" rel="stylesheet">
<script src="http://cdnjs.cloudflare.com/ajax/libs/select2/3.2/select2.min.js"></script>



<select  id="e1" class="select2" style="width:300px">
        <option value="AL">Alabama</option>
        <option value="Am">Amalapuram</option>
        <option value="An">Anakapalli</option>
        <option value="Ak">Akkayapalem</option>
        <option value="WY">Wyoming</option>
    </select>

    <select  id="e2" class="select2" style="width:300px">
        <option value="AL">Alabama</option>
        <option value="Am">Amalapuram</option>
        <option value="An">Anakapalli</option>
        <option value="Ak">Akkayapalem</option>
        <option value="WY">Wyoming</option>
    </select>
<style>
    #e2 .select2-results{
      font-size:4px;
    }
</style>

<script>
$(".select2").select2();
</script>

Answer 1

解决方案：

http://jsfiddle.net/jEADR/3730/

<select  id="e1" class="select2" style="width:300px">
        <option value="AL">Alabama</option>
        <option value="Am">Amalapuram</option>
        <option value="An">Anakapalli</option>
        <option value="Ak">Akkayapalem</option>
        <option value="WY">Wyoming</option>
    </select>

    <select  id="e2" class="select2" style="width:300px">
        <option value="AL">Alabama</option>
        <option value="Am">Amalapuram</option>
        <option value="An">Anakapalli</option>
        <option value="Ak">Akkayapalem</option>
        <option value="WY">Wyoming</option>
    </select>

<script>
$(".select2").select2();
$("#e2").select2({ dropdownCssClass: "myFont" });
</script>

.myFont{
  font-size:4px;
}

Answer 2

我发现此问题的最佳答案是将选项包装在Custom Adapters中并按如下方式设置CSS。

CSS：

div

其他代码：

.fooSelect
{
    display:inline;
}
.fooSelect .select2-selection__rendered
{
    font-size:1.2em;
}

Answer 3

通过尝试你的小提琴我也在Chrome开发工具的帮助下得出了这个答案。另外@Override protected void onActivityResult(int requestCode, int resultCode, Intent data) { super.onActivityResult(requestCode, resultCode, data); if (requestCode == 1) { if(resultCode == RESULT_OK){ amountClicks = getIntent().getIntExtra("currentClicks", 0); incrementAmount = getIntent().getIntExtra("upgradedClicks", 1); tvAmountClicks.setText(""+amountClicks); } } }需要jQuery才能运行。

见下面的示例：

select2

$(".sample").select2({
	width: '200px',
  theme: "classic"
});

/* Select option */
.select2-results__option { 
  font-size: 30px;
}

Answer 4

My change on here

只需添加到每个选项类并使用它。

在js文件

上

$("#e1 option,#e2 option").addClass("font-size-4");
$(".select2").select2();

在Css文件

上

.font-size-4{
   font-size:4px;
}

Answer 5

ul.select2-results__options li{
  font-size:13px;
}

Answer 6

使用下面的CSS选择器。但我更改了此示例的font-size值，因为某些浏览器不会以4px显示字体（有最小设置）

#e2.select2, #e2.select2 option {
  font-size:32px;
}

<select  id="e1" class="select2" style="width:300px">
        <option value="AL">Alabama</option>
        <option value="Am">Amalapuram</option>
        <option value="An">Anakapalli</option>
        <option value="Ak">Akkayapalem</option>
        <option value="WY">Wyoming</option>
    </select>

    <select  id="e2" class="select2" style="width:300px">
        <option value="AL">Alabama</option>
        <option value="Am">Amalapuram</option>
        <option value="An">Anakapalli</option>
        <option value="Ak">Akkayapalem</option>
        <option value="WY">Wyoming</option>
    </select>

Answer 7

您的原始pastebin有一些错误。见下文：

建议将其更改为：

请注意，我更改了以下内容：

Answer 8

我用这个。也许可以帮忙：

.select2-dropdown {
   font-size: 12px;
}

Answer 9

 #e2.select2 {
   font-size: 25px;
}

如何使用css更改一个选择框选项文本（select2）的字体大小？

9 个答案: