text transform html,HTML Style textTransform用法及代码示例

capitalize:该值将文本中每个单词的首字母大写。

例：

DOM Style textTransform Property

GeeksforGeeks

DOM Style textTransform Property

The textTransform property can be used

to capitalize, uppercase or lowercase

the text.

GeeksforGeeks is a computer science portal.

Change textTransform

function setTransform() {

elem = document.querySelector('.content');

elem.style.textTransform = 'capitalize';

}

输出：

在单击按钮之前：

单击按钮后：

uppercase:此值将文本的每个字母转换为大写。

例：

DOM Style textTransform Property

GeeksforGeeks

DOM Style textTransform Property

The textTransform property can be used

to capitalize, uppercase or lowercase

the text.

GeeksforGeeks is a computer science portal.

Change textTransform

function setTransform() {

elem = document.querySelector('.content');

elem.style.textTransform = 'uppercase';

}

输出：

在单击按钮之前：

单击按钮后：

lowercase:此值将文本的每个字母转换为小写。

例：

DOM Style textTransform Property

GeeksforGeeks

DOM Style textTransform Property

The textTransform property can be used to

capitalize, uppercase or lowercase the text.

GeeksforGeeks Is A ComPuTer sCiEnce PortAL.

Change textTransform

function setTransform() {

elem = document.querySelector('.content');

elem.style.textTransform = 'lowercase';

}

输出：

在单击按钮之前：

单击按钮后：

none:这是默认值，指定不进行任何转换。

例：

DOM Style textTransform Property

.content {

width:500px;

/* Set text-transform before to

observe effect of 'none' */

text-transform:capitalize;

}

GeeksforGeeks

DOM Style textTransform Property

The textTransform property can be used

to capitalize, uppercase or lowercase

the text.

GeeksforGeeks is a computer science portal.

Change textTransform

function setTransform() {

elem = document.querySelector('.content');

elem.style.textTransform = 'none';

}

输出：

在单击按钮之前：

单击按钮后：

initial:这用于将此属性设置为其默认值。

例：

DOM Style textTransform Property

.content {

width:500px;

/* Set text-transform before to

observe effect of 'none' */

text-transform:capitalize;

}

GeeksforGeeks

DOM Style textTransform Property

The textTransform property can be used

to capitalize, uppercase or lowercase

the text.