CSS - text-transform 属性_CSS 菜鸟教程

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

可能的值

lowercase：将所有文本转换为小写。
uppercase：将所有文本转换为大写。
capitalize：将每个单词的第一个字符大写。
none：不应用文本转换。
full-width：将所有字符转换为其全角变体。
full-width-kana：将所有小假名字符转换为全尺寸假名字符。这专门用于<ruby>注释文本。
initial：将文本转换值设置为其默认值（none）。
inherit：从其父元素继承 text-transform 值。
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>Text Transform</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>

<< CSS - text-overflow 属性 CSS - text-underline-offset 属性 >>