使用 CSS 将文本小写后可以将其大写吗？

使用CSS小写后大写文本

问题：是否可以先将文本小写，然后使用CSS？

示例：

• HELLO WORLD → Hello World

其他上下文： 您有大写的国家/地区列表（例如，UNITED KINGDOM），需要将它们转换为小写（例如，United Kingdom）。

答案：

是的，CSS 提供此任务的解决方案：

<code class="css">.className {
  text-transform: capitalize;
}</code>

此 CSS 将 text-transform: Capitalize 属性应用于具有类 className 的元素，自动将所有小写字母转换为大写，并将每个单词的第一个字母转换为小写。

使用 JavaScript 的替代解决方案：

如果 CSS 不是一个选项，您可以使用 JavaScript 来实现相同的结果：

<code class="javascript">function capitalize(s) {
  return s.toLowerCase().replace(/\b./g, function (a) {
    return a.toUpperCase();
  });
}

capitalize('this IS THE wOrst string eVeR');</code>

Capitalize 函数将字符串 s 作为输入，使用 toLowerCase() 将其转换为小写，然后使用正则表达式的替换方法将所有单词边界 (b) 替换为其大写等效项。这有效地将每个单词的第一个字母大写，同时将其余字母小写。

以上是使用 CSS 将文本小写后可以将其大写吗？的详细内容。更多信息请关注PHP中文网其他相关文章！