HTML | DOM 样式 textTransform 属性

简介

textTransform 属性用于指定文本的大小写形式。

语法

<style>
    selector {
        text-transform: none|capitalize|uppercase|lowercase|initial|inherit;
    }
</style>

• none：默认值，表示文本不进行任何大小写转换。
• capitalize：将每个单词的首字母转换为大写。
• uppercase：将文本转换为全大写字母。
• lowercase：将文本转换为全小写字母。
• initial：将属性重置为初始值。
• inherit：从父元素继承该属性的值。

示例

HTML 代码

<h1 style="text-transform: capitalize;">hello world</h1>
<h2 style="text-transform: uppercase;">hello world</h2>
<h3 style="text-transform: lowercase;">HELLO WORLD</h3>

渲染结果

hello world

hello world

HELLO WORLD

注意事项

• textTransform 属性只能应用于文本，不能应用于数字和特殊字符。
• 中文字符无法进行大小写转换，会保持原样。
• textTransform 属性会影响到一些 CSS 伪类选择器，如:first-letter、:first-line 等。
• textTransform 是 CSS 样式的一部分，可通过 JS 动态修改其值。

推荐阅读：HTML 字符实体