Javascript 加粗下拉列表中的第一个值

我必须将下拉列表中的第一个值设置为粗体。我尝试了使用

ng class

属性，因为UI是在

angularjs

中开发的，但没有成功。现在，我通过使用第一个子选择器尝试使用

css

。我尝试了以下风格

1)
select#ad-version-select.form-control : first-child {
  font-weight: bold;
}

2)
select#ad-version-select.form-control >: first-child {
  font-weight: bold;
}

但是上面的风格。没用。如果我使用

select#ad-version-select.form-control {
            font-weight: bold;
        }

下拉列表中的所有值都将变为粗体。如何使下拉列表中的第一个值显示为粗体？我不能使用

javascript

或

jquery

。请帮助我使用

css

试试这个方法

select#ad-version-select.form-control option:nth-child(1){
    font-weight:bold;
}

---

你应该这样试一下-

select 35; ad-version-select.form-control选项：第一个子项{
字体大小：粗体；
}

选项
选项
选项
选项

实际上，您不能将选项加粗

高亮显示或加粗的唯一方法是将其设置为选项组

<select>
    <optgroup label="Label Group">
       <option value="label value 1">Label 1</option>
       <option value="Label value 2">Label 2</option>
     </optgroup>
     <optgroup label="Label Group 2">
       <option value="label value 3">Label 3</option>
       <option value="label value 4">Label 4</option>
     </optgroup>
</select>

标签1
标签2
标签3
标签4

你可以在这里试试

---

将完成这项工作，但它仅在firefox中有效，而在google chrome或safari中无效。

您是否尝试过

选项：第一个孩子

？尝试过，但没有成功。使用CSS时，选择下拉列表中设置选项样式的跨浏览器行为非常不一致。例如，在Firefox中，在下拉列表中加粗是可能的，但在Chrome中则不可能，这包括optgroup。如果这些样式很重要，你需要跨浏览器的一致性，那么你可以考虑使用div进行自定义下拉。例如，在这种情况下，如果你不能使用JavaScript（为什么？），那么你就不能跨浏览器。@ Raevenk。我将下拉列表放在一个div中，并将div类名与上面提到的类一起使用。但它不起作用。你的意思是相同的吗？在这里，我不能有组，因为下拉列表中的所有值都属于一种类型。下拉列表中不能有一个粗体值吗？默认情况下，选项值不支持字体粗体。但是您可以使用伪类为值着色。是的。在firefox中工作。。！

select#ad-version-select.form-control option:nth-child(1) {
  font-weight: bold;
}