Стиль шрифта

​Основы использования

​Выделение текста курсивом

Утилиту italic можно использовать для выделения текста курсивом. Точно так же утилиту not-italic можно использовать для обычного отображения текста - обычно для сброса курсивного текста в разных контрольных точках.

<p class="italic ...">Быстрая коричневая лиса ...</p>
<p class="not-italic ...">Быстрая коричневая лиса ...</p>

​Применяя условно

​Наведение, фокус и другие состояния

Tailwind позволяет условно применять служебные классы в разных состояниях с помощью модификаторов вариантов. Например, используйте hover:not-italic, чтобы применять утилиту not-italic только при hover.

<p class="italic hover:not-italic">
  <!-- ... -->
</p>

Полный список всех доступных модификаторов состояния смотрите в документации Наведение, фокус и другие состояния.

​Контрольные точки и медиа-запросы

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

<p class="italic md:not-italic">
  <!-- ... -->
</p>

Чтобы узнать больше, ознакомьтесь с документацией по адаптивному дизайну, темному режиму и другим модификаторам медиазапросов.