如果选项仅大写并且选择没有特定大小，如何仅将第一个字母大写？（CSS）

Question

我有大写option值，并且我只想将第一个字母大写。

我的代码：

option {
  text-transform: lowercase; /* change to lowercase */
}

option::first-letter {
  text-transform: uppercase; /* change first letter to uppercase */
}

<select>
  <option selected>ABC</option>
  <option>DEF</option>
  <option>GHI</option>
</select>

Answer 1

您可以使用option:first-letter它，检查下面更新的代码片段..

select option  {
  text-transform: lowercase; /* change to lowercase */
}
select option:first-letter {
  text-transform: uppercase;
}

<select>
  <option selected>ABC</option>
  <option>DEF</option>
  <option>GHI</option>
</select>