HTML下拉菜单禁用强选项

Question

我正在尝试在HTML下拉菜单中设置类别。更具体地说，我需要根据一个国家的位置对城市进行分组。

在第2行中，我禁用了值。而不是在下拉菜单中使用较浅的颜色，在哪里或我需要做什么，使其成为更粗体的字体？或者禁用功能是否正确处理此方法？

＆＃13;

＆＃13;

<select name="startinglocation" required>
    <option value="" selected disabled>Please select a city...</option>
    <option disabled value="austria">Austria</option>
    <option value="innsbruck">Innsbruck</option>
</select>

＆＃13;

＆＃13;

＆＃13;

Answer 1

执行此操作的正确方法是使用optgroup标记。这是一个例子：

<select name="startinglocation" required>
    <option value="" selected disabled>Please select a city...</option>
    <optgroup label="Austria">
        <option value="innsbruck">Innsbruck</option>
    </optgroup>
</select>

除了将组名称加粗之外，还会缩进每个组中的值。

只是为了完整性，即使它是错误的方式来执行您想要的操作，因为它确实有其他合法用途，这里是如何设置option元素的残缺select元素的样式使用CSS的{1}}框：

option[disabled] {
    /* Styles here */
}