свойство text-transformCSS3-генератор ☛

Управляет преобразованием текста элемента в заглавные или прописные символы. Когда значение отлично от none, регистр исходного текста будет изменён.

Краткая информация

Значение по умолчаниюnone
НаследуетсяДа
ПрименяетсяКо всем элементам
АнимируетсяНет

Синтаксис ?

text-transform: capitalize | lowercase | uppercase | none

Обозначения

ОписаниеПример
<тип>Указывает тип значения.<размер>
A && BЗначения должны выводиться в указанном порядке.<размер> && <цвет>
A | BУказывает, что надо выбрать только одно значение из предложенных (A или B).normal | small-caps
A || BКаждое значение может использоваться самостоятельно или совместно с другими в произвольном порядке.width || count
[ ]Группирует значения.[ crop || cross ]
*Повторять ноль или больше раз.[,<время>]*
+Повторять один или больше раз.<число>+
?Указанный тип, слово или группа не является обязательным.inset?
{A, B}Повторять не менее A, но не более B раз.<радиус>{1,4}
#Повторять один или больше раз через запятую.<время>#

Значения

capitalize
Первый символ каждого слова в предложении будет заглавным. Остальные символы свой вид не меняют.
lowercase
Все символы текста становятся строчными (нижний регистр).
uppercase
Все символы текста становятся прописными (верхний регистр).
none
Не меняет регистр символов.
Пример
<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>text-transform</title>
  <style>
   h1 {
    text-transform: uppercase; /* Заглавные буквы */
   }
   p {
    text-transform: capitalize; /* Каждое слово начинается с заглавной буквы */
   }
  </style>
 </head>
 <body>
 <h1>Культурный памятник Средневековья</h1>
  <p>Амазонская низменность неумеренно берёт
  небольшой провоз кошек и собак, а Хайош-Байа
  славится красными винами. </p>
 </body>
</html>

Объектная модель

Объект.style.textTransform

Браузеры: Настольные Мобильные     ?

Internet ExplorerChromeOperaSafariFirefox
41711
AndroidFirefox MobileOpera MobileSafari Mobile
1161

Браузеры

В таблице браузеров применяются следующие обозначения.

  •  — элемент полностью поддерживается браузером;
  •  — элемент браузером не воспринимается и игнорируется;
  •  — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.

Число указывает версию браузреа, начиная с которой элемент поддерживается.

Текст и шрифт

Справочник CSS
×
Справочник CSS