Как преобразовать заглавную фразу в первое слово в верхнем регистре?

Question

Ввод: я студент
Ожидаемый результат: я студент
Как мне добиться этого с помощью css?

Answer 1

p {
  text-transform: lowercase;
}
p:first-line {
  display: block;
  text-transform: capitalize;
}

<p>I AM A STUDENT</p>

Answer 2

Вы можете использовать text-transform -свойство CSS, если текст начинается с нижнего регистра:

p {
  text-transform: capitalize;
}

Если текст уже написан заглавными буквами, к сожалению, вы можете преобразовать его только в нижний регистр. В качестве альтернативы вы можете использовать ::first letter -селектор, как предложил @Mr Lister, и поместить каждое слово в промежуток следующим образом:

p {
  text-transform: lowercase;
}

span {
  display: inline-block;
}

span::first-letter {
  text-transform: capitalize;
}

<p> <span>I</span> <span>AM</span> <span>A</span> <span>STUDENT</span> </p>

Кроме этого, вы можете, конечно, сделать это с помощью JavaScript, как обсуждено в этой теме , но это должно быть последним средством.