bulma - эффективное изменение размеров шрифта

Мне трудно найти наиболее эффективный способ изменения размера текста для мобильных устройств. Я знаю, что в соответствии с документацией сделать размер текста реагирующим на экран довольно просто, просто добавьте is-size-*-mobile класс для элемента, чтобы сбросить размер текста до значения * (1-7) для мобильных устройств. Какие элементы являются лучшим местом для этого? Например, я хотел бы иметь возможность изменить весь текст на экране до размера 7 на мобильном телефоне, но пока мне пришлось добавить is-size-7-mobile Класс почти для каждого текстового контейнера на странице. Хотя это не невозможно сделать, похоже, что это побеждает цель иметь такой класс, доступный через CSS.

Любые советы будут с благодарностью.

1 ответ

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

Например, если вы хотите изменить весь документ, подумайте о том, чтобы добавить его прямо в элемент body:

      <body class="is-size-7-mobile layout-documentation page-helpers">

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

Другие вопросы по тегам