CSS :: Свойство text-transform

css-свойство text-transform (от англ. text transform – преобразование текста) используется для управления преобразованием текста в прописные (заглавные) или строчные буквы.

Характеристики

Значение по умолчанию: none.
Применяется: ко всем элементам.
Наследуется: да.
Анимируется: нет.
JavaScript: object.style.textTransform="value".

Синтаксис

text-transform: capitalize | lowercase | uppercase | none

Значения

capitalize – прописной (заглавной) становится первая буква каждого слова.
uppercase – все буквы преобразуются в прописные.
lowercase – все буквы преобразуются в строчные.
none – текст отображается стандартным образом.

Ссылки

Официальный сайт W3C: https://drafts.csswg.org/css-text-3/#propdef-text-transform

Статья на Mozilla Firefox: https://developer.mozilla.org/ru/docs/Web/CSS/text-transform

Примеры

HTML Результат

htmlCodes

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">  
	<title>Пример №1</title>

	<style>
		
		p{
		width: 400px;
		margin: 3em;
		}
		
		.p_1{
		text-transform: capitalize;
		background-color: yellow
		}
		
		.p_2{
		text-transform: uppercase;
		background-color: blue
		}
		
		.p_3{
		text-transform: lowercase;
		background-color: green
		}
		
		.p_4{
		text-transform: none;
		background-color: red
		}
		
	</style>
	
</head>
<body>

	<p class="p_1">
		Все первые буквы текста отображаются прописными.
	</p>
	
	<p class="p_2">
		У моего текста ВСЕ буквы ОТОБРАЖАЮТСЯ прописными.
	</p>
	
	<p class="p_3">
		У моего текста ВСЕ буквы ОТОБРАЖАЮТСЯ строчными.
	</p>
	
	<p class="p_4">
		А вот так выглядит ТЕКСТ в стандартном режиме.
	</p>
	
</body>
</html>

Пример №1