CSS-свойство `font-variant-position`

Свойство font-variant-position CSS управляет использованием альтернативных уменьшенных глифов, расположенных в виде верхнего или нижнего индекса.

Глифы располагаются относительно базовой линии шрифта, которая остается неизменной. Такие глифы обычно используются в элементах <sub> и <sup>.

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

Эти альтернативные глифы имеют ту же em-коробку и ту же базовую линию, что и остальные символы шрифта. Они лишь графически изменены и не влияют на высоту строки и другие характеристики блока.

Синтаксис

/* Keyword values */
font-variant-position: normal;
font-variant-position: sub;
font-variant-position: super;

/* Global values */
font-variant-position: inherit;
font-variant-position: initial;
font-variant-position: revert;
font-variant-position: revert-layer;
font-variant-position: unset;

Значения

Это свойство задается одним из следующих ключевых слов:

normal

Отключает альтернативные глифы верхнего и нижнего индексов.

sub

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

super

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

Формальное определение

Формальный синтаксис

font-variant-position = 
  normal |
  sub |
  super

Примеры

Задание форм верхнего и нижнего индексов

HTML

<p class="normal">Normal!</p>
<p class="super">Super!</p>
<p class="sub">Sub!</p>

CSS

p {
  display: inline;
}

.normal {
  font-variant-position: normal;
}

.super {
  font-variant-position: super;
}

.sub {
  font-variant-position: sub;
}

Результат

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

Совместимость с браузерами

См. также

• font-variant
• font-variant-alternates
• font-variant-caps
• font-variant-east-asian
• font-variant-emoji
• font-variant-ligatures
• font-variant-numeric