CSS文本转换大小写是否使其他字母小写？

Question

根据定义，text-transform: capitalize在所选文本中大写每个单词的第一个字母。但是它仅适用于小写文本。我的文字全部大写，如何使用CSS text-transform使首字母大写而其他字母小写？

Answer 1

::first-letter可用于选择block-level elements第一行中的第一个字母。

p {
  text-transform: lowercase;
}
p::first-letter {
  color: red;
  text-transform: capitalize;
}

<p class="capitalize">lowercase</p>
<p class="capitalize">UPPERCASE</p>