Стиль шрифта

Класс italic делает текст наклонным, italic-none возвращает прямое начертание. Берите их, когда наклон — оформление, а не смысловое выделение.

Пример

italic-none снимает наклон, который браузер даёт тегу em.

<div class="grid grid-col-1 sm:grid-col-2 gap-3 p-3 bg-surface border border-outline-variant radius-surface color-on-surface">
  <div class="flex flex-col gap-1">
    <code class="text-1/2 color-on-surface-variant">italic</code>
    <p class="m-0 text-3 italic">Наклонное начертание</p>
  </div>
  <div class="flex flex-col gap-1">
    <code class="text-1/2 color-on-surface-variant">italic-none</code>
    <p class="m-0 text-3"><em class="italic-none">Текст в em</em> без наклона</p>
  </div>
</div>

Классы

Условия (что это): ширина экрана — нет; состояния — нет.

Классы и переменные собраны из CSS выпуска и обновляются вместе с ним.

Применение

Для смыслового выделения пишите <em>: браузер сам покажет его наклонным, а программы чтения с экрана поймут, что это выделение. Классы оставьте для оформления:

<p class="italic color-on-surface-variant">Подпись к иллюстрации</p>
<em class="italic-none weight-7">Выделение жирным вместо наклона</em>

Ограничения

• Если у шрифта нет наклонного начертания, браузер наклоняет прямое искусственно.
• У семейства нет префиксов ширины экрана и состояний.

См. также

• Толщина шрифта
• Семейство шрифтов