CSS资本化所有大写字母的第一个字母

Question

是否可以将仅使用CSS的全部大写字母的第一个字母大写？

那么将"TESTING"更改为"Testing"？

<span class = "capitalize">TESTING</span>

css属性text-transform:capitalize不起作用(将首字母大写但忽略其余字母).

Answer 1

是的,只有CSS,这是如何:

.capitalize {
  text-transform: lowercase;
  display: inline-block;
}

.capitalize:first-letter {
  text-transform: uppercase
}

<span class = "capitalize">TESTING</span>

你会注意到我补充说display:inline-block,这是因为:

"第一行仅在块容器框中有意义,因此:: first-letter伪元素仅对显示值为block,inline-block,table-cell,list-item或table的元素有效. -字幕." 资源