CSS 属性

text-transform 属性用于通过以各种方式转换文本来更改文本的外观。它可用于将文本转换为大写、小写、将每个单词的第一个字母大写，甚至将所有字母大写。

属性值

  • lowercase:将所有文本转换为小写。

  • uppercase:将所有文本转换为大写。

  • capitalize:大写每个单词的第一个字符。

  • none:不应用文本转换。

  • full-width:转换所有字符转换为全角变体。

  • full-width-kana:将所有小假名字符转换为全角假名字符。这专门用于 <ruby> 注释文本。

  • initial:将文本转换值设置为其默认值（无）。

  • inherit:从其父元素继承文本转换值。

  • unset:删除任何先前设置的文本转换值。

适用范围

所有 HTML 元素。

DOM 语法

object.style.textTransform = "uppercase";

css text-transform: 基本示例

这是一个示例:

<html>
<head>
<style>
   div {border:2px solid red; padding: 5px; margin: 2px; width: 300px;}
   span {text-transform: full-width;}
   strong {width: 100%;}
</style>
</head>
<body>
   <h2>文本转换例子</h2>
   <div>
      <p style="text-: capitalize;">Text transformed.</p>
   </div>
   <div>
      <p style="text-transform: lowercase;">Text transformed.</p>
   </div>
   <div>
      <p style="text-transform: uppercase;">Text transformed.</p>
   </div>
   <div>
      <p style="text-transform: none;">Text transformed.</p>
   </div>
   <div>
      <strong>
      <span>TRANSFORMATION OF TEXT AS FULL-WIDTH.</span>
      </strong>
      </div>
</body>
</html>