Jquery 如何更改默认select2占位符颜色的css？

我正在使用select2插件。在必填字段中，我必须将select2占位符颜色设置为红色

如何将默认的select2占位符颜色更改为红色

HTML

<select id="leadadd_mode_of_enq" name="leadadd_mode_of_enq" class="select2 req_place" data-select-search="true" placeholder="Mode of enquiry">
    <option value="1">Opt1</option>
    <option value="2">Opt2</option>
</select>

---

如果我正确理解了您想要的内容，您可能需要使用此选择器

使占位符变为灰色的原始CSS

.select2-default {
  color: #f00 !important;
}

更改您首选的占位符颜色

.select2-default {
  color: #f00 !important;
}

特定占位符颜色（使用id）

另外，要使用占位符，您必须添加一个空的

，否则将自动选择第一个选项，但不会选择占位符

像这样

<select id="leadadd_mode_of_enq" name="leadadd_mode_of_enq" class="select2 req_place" data-select-search="true" placeholder="Mode of enquiry">
  <option></option>
  <option value="1">Opt1</option>
  <option value="2">Opt2</option>
</select>

Opt1
Opt2

---

select2将css类从源

select

标记复制到它的容器中。因此，您可以简单地将此css用于html：

.select2-container.req_place .select2-default .select2-chosen { 
    color:#FFF !important; 
}

---

给出的答案很旧，现在可以使用css类

.select2-selection__placeholder {
    color: #FF0000;
}

---

试试这个默认的css

  ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: pink;
  }

  ::-moz-placeholder {
    /* Firefox 19+ */
    color: pink;
  }

  :-ms-input-placeholder {
    /* IE 10+ */
    color: pink;
  }

  :-moz-placeholder {
    /* Firefox 18- */
    color: pink;
  }

---

我使用的是4.0.3版，我必须更改

。select2-selection\uu占位符

，因为

select2 default

类不存在。这很好，但您必须添加

！重要信息

属性以使其正常工作。@Brhaka您应该在添加自己的css之前包含select2 css（您应该按照正常做法这样做，以避免第三方覆盖项目中的任何样式）。这样，您的任何自定义都会覆盖默认设置，而不需要！重要。当然，这是一个很好的练习！但是如果您使用的是内联或内部CSS，

！重要信息

属性派上用场！

.select2-container.req_place .select2-default .select2-chosen { 
    color:#FFF !important; 
}

.select2-selection__placeholder {
    color: #FF0000;
}

  ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: pink;
  }

  ::-moz-placeholder {
    /* Firefox 19+ */
    color: pink;
  }

  :-ms-input-placeholder {
    /* IE 10+ */
    color: pink;
  }

  :-moz-placeholder {
    /* Firefox 18- */
    color: pink;
  }