Uppercase css: text-transform | htmlbook.ru

Leave a Comment / Css / By /

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

Синтаксис

CSS 1

CSS 2‒2.2

CSS 3

text-transform: capitalize | uppercase | lowercase | none | inherit

Описание

Свойство text-transform (от англ. «text transform» ‒ «преобразование текста») управляет эффектами капитализации текста элемента.

Применяется:ко всем элементам;
Наследование:присутствует;
Проценты:Н/Д;
Медиа:визуальные.

Примечание

Фактическое преобразование в каждом случае зависит от языка содержимого.

JavaScript

[объект].style.textTransform="[значение]";

Поддержка браузерами

Chrome

Поддерж.

Firefox

Поддерж.

Opera

Поддерж.

Maxthon

Поддерж.

IExplorer

Поддерж.

Safari

Поддерж.

iOS

Поддерж.

Android

Поддерж.

Спецификация

CSSРаздел
15.4.5 ‘text-transform’Перевод
216.5 Capitalization: the ‘text-transform’ property
2.116.5 Capitalization: the ‘text-transform’ property
2.216.5 Capitalization: the ‘text-transform’ property
32.1. Case Transforms: the ‘text-transform’ property

Значения

capitalize
Преобразует первую букву каждого слова в верхний регистр; другие символы не изменяются.

text-transform: capitalize;

full-width
Переводит все символы в полноширинную форму. Если символ не имеет соответствующей полноширинной формы, он остаётся как есть. Это значение обычно используется для печати латинских символов и цифр, таких как идеографические символы.

text-transform: full-width;

lowercase
Преобразует все буквы элемента в нижний регистр.

text-transform: lowercase;

none
Эффект капитализации отсутствует (отменяет наследуемое значение).

text-transform: none;

uppercase
Преобразует все буквы элемента в верхний регистр.

text-transform: uppercase;

inherit
Указывает, что элемент должен унаследовать параметры родительского элемента.

Начальное значение: «none».

Пример использования

Листинг кода

<!DOCTYPE html>
<html>
<head>
<meta charset=»utf-8″>
<title>Свойство text-transform</title>
<style type=»text/css»>
p { text-transform: capitalize; }
</style>
</head>
<body>
<h2>Преобразование текста</h2>

<p>Первая буква каждого слова в данном абзаце преобразуется в верхний регистр.</p>
</body>
</html>

Свойство text-transform

.uppercase — Класс CSS Tailwind

← Список классов CSS Tailwind

 Lorem ipsum dolor sit amet, consectetur

Preview

Lorem ipsum dolor sit amet, consectetur

900 06 Проверить .верхний регистр в реальный проект

Щелкните один из приведенных ниже примеров, чтобы открыть визуальный редактор Shuffle с библиотекой пользовательского интерфейса, использующей выбранный компонент.

Открыть в визуальном редакторе →

Открыть в визуальном редакторе →

Открыть в визуальном редакторе →

Открыть в визуальном редакторе →

Открыть в визуальном редакторе →

Открыть в визуальном редакторе →

Открыть в визуальном редакторе →

Открыть в визуальном редакторе →

Открыть в визуальном редакторе →

Открыть в визуальном редакторе →

Источник CSS 

 . uppercase {
    преобразование текста: верхний регистр;
}

Подробнее в тексте CSS Tailwind

  • .сглаживание
  • .subpixel-сглаживание
  • .text-opacity-*
  • .break-нормальный
  • .разрывные слова
  • .сломать все
  • .truncate
  • .нижний регистр
  • .с большой буквы
  • . нормальный случай
  • .ведущий-нет
  • .натяжной
  • .ведущий-снаг
  • .ведущий-нормальный
  • .ведущий-расслабленный
  • .ведущий свободный
  • .ведущий-3
  • .ведущий-4
  • .ведущий-5
  • . ведущий-6
  • .ведущий-7
  • .ведущий-8
  • .ведущий-9
  • .ведущий-10
  • .подчеркнуть
  • .line-через
  • .без подчеркивания
  • .шрифт-прическа
  • .тонкий шрифт
  • . фонт-свет
  • .шрифт-обычный
  • .шрифт-средний
  • .шрифт-полужирный
  • .шрифт полужирный
  • .шрифт-сверхжирный
  • .черный шрифт
  • .текст-xs
  • .текст-см
  • .текстовая база
  • . текст-lg
  • .текст-xl
  • .текст-2xl
  • .текст-3xl
  • .текст-4xl
  • .текст-5xl
  • .text-6xl
  • .шрифт-без
  • .шрифт с засечками
  • .шрифт-моно
  • .текст слева
  • . текст-центр
  • .текст справа
  • .текстовое выравнивание
  • .курсив
  • .не курсив
  • .whitespace-нормальный / .whitespace-*
  • .усилитель слежения
  • .зажимной
  • .трекинг-нормальный
  • .tracking-wide
  • . трекинг-широкий
  • .широкое отслеживание
Попутный ветер CSS
  • Редактор попутного ветра
  • Компоненты попутного ветра
  • Шаблоны попутного ветра

Свойство CSS: преобразование текста: капитализация | Могу ли я использовать… Таблицы поддержки для HTML5, CSS3 и т. д.

Могу ли я использовать

Поиск ?

Свойство CSS: преобразование текста: капитализация

  • Глобальное использование
    97,59% + 0% «=» 97,59%
IE
  1. 12% — Supported»> 6–10: поддерживается
  2. 11: поддерживается
Edge
  1. 12–112: поддерживается
  2. 11 3: Поддерживается
Firefox
  1. 2 — 112: Поддерживается
  2. 113: Поддерживается
  3. 114–115: поддерживается
Chrome
  1. 4–112: поддерживается
  2. 113: поддерживается
  3. 114–116: поддерживается
Safari
  1. 3.1–16.4: поддерживается
  2. 16.5: поддерживается
  3. 16. 6 — TP: поддерживается
Opera
9019 6
  • 10–98: поддерживается
  • 99: поддерживается
    • Safari на iOS
    1. 3.2–16.4: Поддерживается
    2. 16.5: Поддерживается
    Opera Mini
    1. все: Поддержка неизвестна
    Браузер Android
    1. 2.1–4 .3: не поддерживается
    2. 4.4 — 4.4.4: поддерживается
    3. 113: поддерживается
    Opera Mobile
    1. 12–12.1: поддерживается
    2. 73: поддерживается
    Chrome для Android
      90 283 113: Поддерживается
    Firefox для Android

    Добавить комментарий

    Ваш адрес email не будет опубликован. Обязательные поля помечены *